const io = new Server(server, {
transports: ["polling", "websocket"],
cors: {
origin: "*"
}
});
const onMouseRotate = (wrap, elem) => {
const wrapper = document.querySelector(wrap);
let currentX;
let currentY;
let currentTarget = null
if (!wrapper) return;
const changeRotateSlider = (evt) => {
const target = evt.target.closest(elem);
if (currentTarget) {
currentTarget.style.cssText = `transform: perspective(700px) rotateX(${currentY / 60}deg) rotateY(${-currentX / 60}deg) scale3d(1.02, 1.02, 1.02)!important; box-shadow: 0 0 20px 3px rgba(0,0,0,0.2);`
}
if (target !== currentTarget && currentTarget || currentTarget && !target) {
currentTarget.style.cssText = `transform: perspective(700px) rotateX(0deg) rotateY(0deg) scale3d(1, 1, 1)!important; box-shadow: 0 0 10px 5px rgba(0,0,0,0);`;
}
if (!target) return;
currentTarget = target;
currentX = evt.clientX - target.getBoundingClientRect().left - target.getBoundingClientRect().width / 2;
currentY = evt.clientY - target.getBoundingClientRect().top - target.getBoundingClientRect().height / 2;
}
wrapper.addEventListener('mousemove', changeRotateSlider);
}
onMouseRotate('.courses', '.course__inner');
export const ContentContext = React.createContext()
export const arrCart = []
//Есть компонент родитель Content
function Content() {
let [cart, setCart] = useState([])
function addCart(roll) {
arrCart.push(roll)
// console.log(typeof arrCart, arrCart)
}
return (
<ContentContext.Provider value={{cart, setCart, addCart}}>
<div className={styles.content}>
<Goods />
<Cart />
</div>
</ContentContext.Provider>
);
}
//Компонент Goods он выводит товары которые можно добавить в корзину
function Goods() {
const {setCart} = React.useContext(ContentContext)
return (
// Код который выводит товары на страницу
//Кнопка которая должна добавлять в корзину()
<button onClick={()=> { addCart(roll) return setCart(roll)}} className={styles.btn__add} type='button'>Add</button>
//Компонент Cart сюда я должен получать массив
import { arrCart } from '../Content';
function Cart() {
console.log(arrCart)
return ()
}
Если внутри контейнера находится длинный текст который должен переноситься, то ширина контейнера должна равняться ширине длинный текст который не должен переноситься, но не менее 200 пикселей- не в обиду, это ломает мне мозг, и я не в силах это понять, надеюсь кто-то другой подскажет
onClick={()=> { addCart() return setCart(roll)}}
addCart
синхронная функция что она делает - добавляет в массив cart а cart по дефолту это пустой массив, поэтому сначала добавляется пустотаimport { arrCart } from '../Content'; // за место импорта - пользуйся контекстом , если твой компонент Cart находится внутри контекста
function Cart() {
console.log(arrCart)
return ()
}
мой код на сервер
на клиенте
в nginx location у меня почти такой же который скинул по ссылке выше, со stackoverflow