Вопросы с тегом «reactjs»

Каков правильный способ обновления состояния вложенного объекта в React with Hooks? export Example = () => { const [exampleState, setExampleState] = useState( {masterField: { fieldOne: "a", fieldTwo: { fieldTwoOne: "b" fieldTwoTwo: "c" } } }) Как бы один использовать setExampleStateдля обновления exampleStateдо a(добавления поля)? const a = { masterField: { …

100 javascript  reactjs  react-hooks 

Я только начинаю с Reactjs, писал простой компонент для отображения liтега и наткнулся на эту ошибку: Неожиданный токен '<' Я поместил пример в jsbin ниже http://jsbin.com/UWOquRA/1/edit?html,js,console,output Пожалуйста, дайте мне знать, что я делаю не так.

99 reactjs 

Я пытаюсь создать простую форму с помощью response, но сталкиваюсь с трудностями при правильной привязке данных к defaultValue формы. Я ищу следующее поведение: Когда я открываю свою страницу, поле ввода текста должно быть заполнено текстом моего сообщения AwayMessage в моей базе данных. Это «Образец текста» В идеале я хочу иметь …

99 javascript  forms  reactjs  coffeescript  2-way-object-databinding 

Есть ли способы моделирования componentDidMountфункциональных компонентов React с помощью хуков?

99 javascript  reactjs  react-hooks 

Я пытаюсь импортировать компоненты из реакции-материализации как - import {Navbar, NavItem} from 'react-materialize'; Но когда веб-пакет компилирует мой, .tsxон выдает ошибку для вышеуказанного: ERROR in ./src/common/navbar.tsx (3,31): error TS7016: Could not find a declaration file for module 'react-materi alize'. 'D:\Private\Works\Typescript\QuickReact\node_modules\react-materialize\l ib\index.js' implicitly has an 'any' type. Любое решение для этого. …

99 reactjs  webpack  webpack-2 

У меня есть функциональный компонент, и я хочу заставить его повторно отрисоваться. Как я могу это сделать? Поскольку экземпляра нет this, я не могу позвонить this.forceUpdate().

99 javascript  reactjs 

Итак, у меня есть это: let total = newDealersDeckTotal.reduce(function(a, b) { return a + b; }, 0); console.log(total, 'tittal'); //outputs correct total setTimeout(() => { this.setState({dealersOverallTotal: total}); }, 10); console.log(this.state.dealersOverallTotal, 'dealersOverallTotal1'); //outputs incorrect total newDealerDeckTotal - это просто массив чисел, [1, 5, 9]например, но this.state.dealersOverallTotalне дает правильной суммы, но totalдает? …

99 javascript  reactjs  state  setstate 

Имею следующее: <Route name="app" path="/" handler={App}> <Route name="dashboards" path="dashboards" handler={Dashboard}> <Route name="exploreDashboard" path="exploreDashboard" handler={ExploreDashboard} /> <Route name="searchDashboard" path="searchDashboard" handler={SearchDashboard} /> <DefaultRoute handler={DashboardExplain} /> </Route> <DefaultRoute handler={SearchDashboard} /> </Route> При использовании DefaultRoute SearchDashboard отображается некорректно, поскольку любая * Dashboard должна отображаться в Dashboard. Я хотел бы, чтобы мой DefaultRoute в маршруте …

98 javascript  routes  reactjs  url-redirection  react-router 

перед тем, как опубликовать этот вопрос, я попытался выполнить поиск в sqa stackexchange, но я не нашел там сообщения о мелководье и рендеринге, поэтому я надеюсь, что кто-то может мне помочь здесь. Когда мне следует использовать мелкую глубину и рендеринг при тестировании реагирующих компонентов? Основываясь на документах airbnb, я сделал …

98 testing  meteor  reactjs  chai  enzyme 

Я пытаюсь передать имя класса компоненту реакции, чтобы изменить его стиль, и, похоже, не могу работать: class Pill extends React.Component { render() { return ( <button className="pill {this.props.styleName}">{this.props.children}</button> ); } } <Pill styleName="skill">Business</Pill> Я пытаюсь изменить стиль таблетки, передав имя класса, имеющего соответствующий стиль. Я новичок в React, поэтому, возможно, …

98 javascript  reactjs 

У меня есть языковые настройки в контексте, как показано ниже class LanguageProvider extends Component { static childContextTypes = { langConfig: PropTypes.object, }; getChildContext() { return { langConfig: 'en' }; } render() { return this.props.children; } } export default LanguageProvider; Код моего приложения будет примерно таким, как показано ниже <LanguageProvider> <App> …

98 javascript  reactjs  react-context 

Я знаю, что расширения chrome используют manifest.json, но здесь он используется как нечто другое. содержание - { "short_name": "React App", "name": "Create React App Sample", "icons": [ { "src": "favicon.ico", "sizes": "192x192", "type": "image/png" } ], "start_url": "./index.html", "display": "standalone", "theme_color": "#000000", "background_color": "#ffffff" } Когда я меняю какое-то значение, …

98 reactjs  manifest  create-react-app 

Скажем, у меня есть список простых объектов, this.state.listкоторые я затем могу использовать для рендеринга списка потомков. В какой же тогда правильный способ вставить объект this.state.list? Ниже приведен единственный способ, который, я думаю, будет работать, потому что вы не можете this.stateнапрямую изменять, как указано в документе. this._list.push(newObject): this.setState({list: this._list}); Мне это …

97 javascript  reactjs 

При отправке формы я пытаюсь doSomething()изменить поведение публикации по умолчанию. Судя по всему, в React onSubmit - это поддерживаемое событие для форм. Однако, когда я пробую следующий код: var OnSubmitTest = React.createClass({ render: function() { doSomething = function(){ alert('it works!'); } return <form onSubmit={doSomething}> <button>Click me</button> </form>; } }); Метод …

97 javascript  forms  form-submit  reactjs  onsubmit 

Я новичок в ReactJs. Это мой код: var React = require('react'); var ReactDOM = require('react-dom'); var {Route, Router, IndexRoute, hashHistory} = require('react-router'); var Main = require('Main'); ReactDOM.render( <Router history={hashHistory}> <Route path="/" component={Main}></Route> </Router>, document.getElementById('app')); и компилируем его с помощью webpack. Также я добавил к своим псевдонимам компонент Main. Консоль выдает …

97 reactjs  react-router