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

Я создаю и слушаю обычные DOM CustomEventдля связи с родительскими узлами: У ребенка: var moveEvent = new CustomEvent('the-graph-group-move', { detail: { nodes: this.props.nodes, x: deltaX, y: deltaY }, bubbles: true }); this.getDOMNode().dispatchEvent(moveEvent); В родительском: componentDidMount: function () { this.getDOMNode().addEventListener("the-graph-group-move", this.moveGroup); }, Это работает, но есть ли способ, специфичный для React, …

85 reactjs 

Начальное состояние в приложении Redux можно установить двумя способами: передать его как второй аргумент createStore( ссылка на документы ) передайте его в качестве первого аргумента вашим (под) редукторам ( ссылка на документы ) Если вы передадите начальное состояние своему магазину, как вы прочитаете это состояние из магазина и сделаете его …

85 javascript  reactjs  redux 

У меня есть компонент контейнера response-redux, который создается в компоненте React Native Navigator. Я хочу иметь возможность передавать навигатор в качестве опоры этому компоненту контейнера, чтобы после нажатия кнопки внутри его презентационного компонента он мог помещать объект в стек навигатора. Я хочу сделать это без необходимости вручную писать весь шаблонный …

85 reactjs  react-native  redux  react-redux 

Я видел, что React 16 позволяет передавать атрибуты в DOM. Значит, это означает, что вместо className можно использовать class, верно? Мне просто интересно, есть ли преимущества в использовании className по сравнению с class, помимо обратной совместимости с предыдущими версиями React.

84 reactjs 

Когда я запускаю webpackтерминал, я получаю: Hash: efea76b1048c3a97b963 Version: webpack 1.12.13 Time: 33ms + 1 hidden modules ERROR in Cannot find module 'babel-core' Вот мой файл webpack.config.js module.exports = { entry: './app-client.js', output: { filename: 'public/bundle.js' }, module: { loaders: [ { exclude: /(node_modules|app-server.js)/, loader: 'babel' } ] } } …

84 javascript  express  reactjs  webpack  babeljs 

Имитация нажатия кнопки кажется очень простой / стандартной операцией. Тем не менее, я не могу заставить его работать в тестах Jest.js. Это то, что я пробовал (и тоже делал это с помощью jQuery), но, похоже, ничего не сработало: import { mount } from 'enzyme'; page = <MyCoolPage />; pageMounted = …

84 javascript  reactjs  testing  jestjs  enzyme 

Пытаемся найти оптимальный способ создания обработчиков событий в компонентах React без сохранения состояния. Я мог бы сделать что-то вроде этого: const myComponent = (props) => { const myHandler = (e) => props.dispatch(something()); return ( <button onClick={myHandler}>Click Me</button> ); } Недостатком здесь является то, что каждый раз, когда этот компонент отображается, …

84 javascript  reactjs 

Я использую компонент Link из маршрутизатора reactjs, и мне не удается заставить onClickevent работать. Это код: <Link to={this.props.myroute} onClick='hello()'>Here</Link> Это способ сделать это или другой способ?

84 reactjs  react-router  react-redux 

Я новичок в ReactJS. Раньше я использовал jQuery для установки любой нужной мне анимации или функции. Но теперь я пытаюсь использовать ReactJS и минимизировать использование jQuery. Мой случай: Я пытаюсь построить аккордеон с помощью ReactJS. <div class="accor"> <div class="head">Head 1</div> <div class="body hide">Body 1</div> </div> <div class="accor"> <div class="head">Head 1</div> …

84 javascript  jquery  reactjs 

У меня есть роутер, как показано ниже: <Router history={hashHistory}> <Route path="/" component={App}> <IndexRoute component={Index}/> <Route path="login" component={Login}/> </Route> </Router> Вот чего я хочу добиться: Перенаправить пользователя, /loginесли он не вошел в систему Если пользователь пытался получить доступ, /loginкогда он уже вошел в систему, перенаправьте его на root/ так что теперь …

83 javascript  reactjs  react-router 

Я использую webpack для создания своих реагирующих компонентов, и я пытаюсь использовать его, extract-text-webpack-pluginчтобы отделить свой css от сгенерированного файла js. Однако, когда я пытаюсь построить компонент я получаю следующее сообщение об ошибке: Module build failed: ReferenceError: window is not defined. Мой файл webpack.config.js выглядит так: var webpack = require('webpack'); …

83 reactjs  webpack 

Я хочу отобразить свой компонент после того, как мой запрос ajax будет выполнен. Ниже вы можете увидеть мой код var CategoriesSetup = React.createClass({ render: function(){ var rows = []; $.get('http://foobar.io/api/v1/listings/categories/').done(function (data) { $.each(data, function(index, element){ rows.push(<OptionRow obj={element} />); }); return (<Input type='select'>{rows}</Input>) }) } }); Но я получаю сообщение об …

83 javascript  ajax  asynchronous  reactjs  jquery-deferred 

Глядя на этот пример React Router Dom v4 https://reacttraining.com/react-router/web/example/auth-workflow, я вижу, что компонент PrivateRoute разрушает такую ​​опору отдыха, как это const PrivateRoute = ({ component: Component, ...rest }) => ( <Route {...rest} render={props => ( fakeAuth.isAuthenticated ? ( <Component {...props}/> ) : ( <Redirect to={{ pathname: '/login', state: { from: …

83 reactjs  react-router 

В большинстве случаев наличие родительского тега не является проблемой. React.createClass({ render: function() { return ( <tbody> <tr><td>Item 1</td></tr> <tr><td>Item 2</td></tr> </tbody> ); } }); Но в некоторых случаях имеет смысл иметь элементы-братья в одной функции рендеринга без родительского элемента, и особенно в случае таблицы вы не хотите заключать строку таблицы …

82 reactjs 

Я создал новое приложение для реагирования с помощью create-react-appcli. Затем я добавил 'react-redux'библиотеку, используя npm install --save react-redux. У package.jsonменя есть: "react-redux": "^4.4.5" К сожалению, приложение не компилируется и жалуется на: Error in ./~/react-redux/lib/utils/wrapActionCreators.js Module not found: 'redux' in C:\Users\Salman\Desktop\Courses\Internship\React\Youtube-Front-End\node_modules\react-redux\lib\utils @ ./~/react-redux/lib/utils/wrapActionCreators.js 6:13-29 Понятия не имею, что это значит? Вот …

82 reactjs  react-redux