createIsOptionDisabled = disOptions => option =>
disOptions.some(({ value }) => value === option.value);return (
<Select
options={options}
isOptionDisabled={this.createIsOptionDisabled(disOptions)}
/>
);import React, { useCallback, useRef } from 'react';
import ReactDOM from 'react-dom';
import { combineReducers, createStore } from 'redux';
import { Provider, connect } from 'react-redux';
// action type
const ADD_MESSAGE = 'ADD_MESSAGE';
// action creator
const addMessage = payload => ({
type: ADD_MESSAGE,
payload,
});
// reducer
const messages = (state = [], action) => {
switch (action.type) {
case ADD_MESSAGE:
return [...state, action.payload];
default:
return state;
}
};
// root reducer
const rootReducer = combineReducers({
messages,
});
// store
const store = createStore(rootReducer);
const App = ({ addMessage, messages }) => {
const inputRef = useRef(null);
const handler = useCallback(() => {
addMessage(inputRef.current.value);
inputRef.current.value = '';
}, [inputRef, addMessage]);
return (
<div>
<ul>
{messages.map((message, i) => (
<li key={i}>{message}</li>
))}
</ul>
<input ref={inputRef} />
<button onClick={handler}>Add Message</button>
</div>
);
};
const mapStateToProps = state => ({
messages: state.messages,
});
const mapDispatchToProps = {
addMessage,
};
const ConnectedApp = connect(
mapStateToProps,
mapDispatchToProps
)(App);
const root = (
<Provider store={store}>
<ConnectedApp />
</Provider>
);
const rootElement = document.getElementById('root');
ReactDOM.render(root, rootElement);import React, { useCallback, useRef } from 'react';
import ReactDOM from 'react-dom';
import { combineReducers, createStore } from 'redux';
import { Provider, connect } from 'react-redux';
import { createAction, createReducer } from 'redux-act';
// action creator
const addMessage = createAction('ADD_MESSAGE');
// reducer
const messages = createReducer({}, []);
messages.on(addMessage, (state, message) => [...state, message]);
// root reducer
const rootReducer = combineReducers({
messages,
});
// store
const store = createStore(rootReducer);
const App = ({ addMessage, messages }) => {
const inputRef = useRef(null);
const handler = useCallback(() => {
addMessage(inputRef.current.value);
inputRef.current.value = '';
}, [inputRef, addMessage]);
return (
<div>
<ul>
{messages.map((message, i) => (
<li key={i}>{message}</li>
))}
</ul>
<input ref={inputRef} />
<button onClick={handler}>Add Message</button>
</div>
);
};
const mapStateToProps = state => ({
messages: state.messages,
});
const mapDispatchToProps = {
addMessage,
};
const ConnectedApp = connect(
mapStateToProps,
mapDispatchToProps,
)(App);
const root = (
<Provider store={store}>
<ConnectedApp />
</Provider>
);
const rootElement = document.getElementById('root');
ReactDOM.render(root, rootElement);Правда ли, что сейчас так сложно найти работу?
Или лучше так
const recommendation = recommendations.find(({ movieId }) => movieId === movie.id);так как вк ведь тоже на react-е
но при этом в local storage нет токенов
нет данных пользователя
Где хранить данные полученные от сервера после авторизации
Как разрешить указывать уникальный url для страницы профиля
Что бы хотел получить в ответ на вопросы:
1) Правильно ли у меня сейчас сделано.
2) Если не правильно, то как сделать правильно.
3) Литературу, которая бы помогла приблизиться к вк по реализации этого вопроса.
4) Так же очень сильно хотелось бы узнать, где можно найти литературу, которая бы помогла сделать приложение максимально безопасным.
https://site.net/?name=<script>alert(document.cookie)</script>В данном примере curPrice - это props получаемые от сервера
Поэтому чтобы записать State - приходится делать дополнительную проверку,
которую я нигде в примерах не встречал - это правильно?..
%%START<strong>Lorem ipsum</strong> <i>dolor <u>sit amet%%END<span><strong>Lorem ipsum</strong> </span><i><span>dolor </span><u><span>sit amet</span>