И если я САМ не могу справиться с такой задачей, то стоит ли делать вывод, что я не осилю даже уровень джуниора попросту потому, что не хватает интеллекта и на программирование стоит забить?
1. Нажал на кнопку
2. Если кнопка вправо
2.1 то нужно извлечь последний элемент из массива и вставить его в начало
2.2 иначе извлечь первый элемент массива и вставить его в конец.
onClickNext
var last = array.pop()
array.unshift(last)
onClickPrev
var first = array.shift()
array.push(first)
Footer/
+ tab
<Footer>
. Возможно, этот конфиг решает вопрос и для HTML.const galleryItems = [
{
src: 'http://....' // абсолютный или относительный путь,
comments: ['Комментарий по умолчанию'],
id: 1
},
{
src: 'http://....' // абсолютный или относительный путь,
comments: ['Комментарий по умолчанию ко второй картинке'],
id: 2
}
]
{ [imageId]: galleryItem } // galleryItem - объект из массива
и тогда по id из хэш таблицы считывать картинку и добавлять комментарий - не будет поиска по массиву на каждое добавление комментария. Верстка делается сразу в React компонентах ? Или вначале делается классическая верстка, а потом переносится в React?
если сайт на React, там все должно быть на React или допускается сделать некоторые элементы на нативном Js
const addTask = async (event) => {
event.preventDefault();
await API.post("/tasks", {
title: title
});
setTasks([...tasks, { title: title }])
};
API.post
возвращает промис, то стоит обновлять стэйт в .then(). Ну или через await
render
определить как метод, а не как переменную?// Не так
render = () => {
// code...
}
// А так
render() {
// code...
}
// И так
function App() {
return <DragAndDropSidebar/>
}
// Или так:
const App = <DragAndDropSidebar/>
const Logic = () => {
const [inputValues, setInputValues] = useState('');
console.log('1)', inputValues);
const onChangeInput = e => {
setInputValues((currentState) => {
console.log('2) current', currentState);
return e.target.value});
console.log('3)', inputValues);
};
return <View inputValues={inputValues} onChangeInput={onChangeInput} />;
};
// Будем вводить букву 'a' в инпут. В итоге в консоле получим:
// 1)"" <-- из-за useState('');
// 2) current "" <-- так как значение мы ещё не обновили, то получаем то же начальное значение из useState('');
// 3) "" <-- вызвывается ПОСЛЕ setInputValues, тем не менее, имеет ещё не обновлённое значение.
// 1) a <-- произошло изменение состояния, компонент перерисовался.
import React from 'react';
class Component1 extends React.Component {
constructor(props) {
super(props);
this.func = this.func.bind(this);
}
func(name) {
console.log(`I am ${name}`);
}
render() {
return ( <Component2 onOpen = {this.func}/>)
}
}
class Component2 extends React.Component {
constructor(props) {
super(props);
}
render() {
return (
<div onClick={() => {this.props.onOpen('Groot')}}> Who am i ? </div>
)
}
}