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

Я изучаю возможности React Native при разработке демонстрационного приложения с настраиваемой навигацией между представлениями с помощью Navigatorкомпонента . Основной класс приложения отображает навигатор, а внутри renderSceneвозвращает переданный компонент: class App extends React.Component { render() { return ( <Navigator initialRoute={{name: 'WelcomeView', component: WelcomeView}} configureScene={() => { return Navigator.SceneConfigs.FloatFromRight; }} renderScene={(route, navigator) …

158 javascript  ios  navigation  reactjs  react-native 

var MySelect = React.createClass({ change: function(){ return document.querySelector('#lang').value; }, render: function(){ return( <div> <select id="lang"> <option value="select" onChange={this.change}>Select</option> <option value="Java" onChange={this.change}>Java</option> <option value="C++" onChange={this.change}>C++</option> </select> <p></p> <p value={this.change}></p> </div> ); } }); React.render(<MySelect />, document.body); onChangeСобытие не работает.

158 javascript  reactjs 

Мне нужно добавить динамический класс в список обычных классов, но я понятия не имею, как (я использую babel), что-то вроде этого: <div className="wrapper searchDiv {this.state.something}"> ... </div> Любые идеи?

158 css  reactjs 

Я написал некоторый код: function renderGreeting(Elem: React.Component<any, any>) { return <span>Hello, <Elem />!</span>; } Я получаю сообщение об ошибке: Тип элемента JSX Elemне имеет никакой конструкции или сигнатуры вызовов Что это означает?

158 reactjs  typescript  material-ui 

Существует ли системный подход к отладке того, что вызывает повторную визуализацию компонента в React? Я поместил простой console.log (), чтобы увидеть, сколько раз он рендерится, но у меня возникают проблемы с выяснением того, что вызывает рендеринг компонента несколько раз, т.е. (4 раза) в моем случае. Существует ли инструмент, который отображает …

156 reactjs  redux 

Есть ли способ включить фигурную скобку React и hrefтег? Скажем, у нас есть следующее значение в состоянии: {this.state.id} и следующие атрибуты HTML для тега: href="#demo1" id="demo1" Есть ли способ добавить idсостояние в атрибут HTML, чтобы получить что-то вроде этого: href={"#demo + {this.state.id}"} Который даст: #demo1

156 javascript  html  reactjs  ecmascript-6 

Недавно я посмотрел на фреймворк Facebook React . Он использует концепцию под названием «виртуальный DOM», которую я не совсем понял. Что такое виртуальный DOM? Каковы преимущества?

156 javascript  reactjs 

Мне нужно создать форму, которая будет отображать что-то на основе возвращаемого значения API. Я работаю со следующим кодом: class App extends React.Component { constructor(props) { super(props); this.state = {value: ''}; this.handleChange = this.handleChange.bind(this); this.handleSubmit = this.handleSubmit.bind(this); } handleChange(event) { this.setState({value: event.target.value}); } handleSubmit(event) { alert('A name was submitted: ' + …

155 reactjs  typescript 

Недавно запущенные функции реагируют только на пример приложения для iOS и документы.

154 android  reactjs  react-native 

Так что это единственный способ рендеринга необработанного HTML с помощью ответной реакции? // http://facebook.github.io/react/docs/tutorial.html // tutorial7.js var converter = new Showdown.converter(); var Comment = React.createClass({ render: function() { var rawMarkup = converter.makeHtml(this.props.children.toString()); return ( <div className="comment"> <h2 className="commentAuthor"> {this.props.author} </h2> <span dangerouslySetInnerHTML={{__html: rawMarkup}} /> </div> ); } }); Я знаю, …

154 javascript  reactjs 

Что эквивалентно функции angular $ watch в React.js? Я хочу прослушивать изменения состояния и вызывать такую ​​функцию, как getSearchResults (). componentDidMount: function() { this.getSearchResults(); }

153 javascript  reactjs 

Допустим, у меня есть 3 входа: скорость, sendAmount и receiveAmount. Я поставил эти 3 входа на использование различных параметров. Правила таковы: Если sendAmount изменился, я рассчитываю receiveAmount = sendAmount * rate Если полученная сумма изменилась, я рассчитываю sendAmount = receiveAmount / rate Если ставка изменилась, я рассчитываю receiveAmount = sendAmount …

151 reactjs  react-hooks 

Похоже, что componentWillReceivePropsв следующих выпусках он будет полностью прекращен в пользу нового метода жизненного цикла getDerivedStateFromProps: static getDerivedStateFromProps () . При осмотре похоже, что теперь вы не можете провести прямое сравнение между this.propsи nextProps, как вы можете в componentWillReceiveProps. Есть ли способ обойти это? Кроме того, теперь он возвращает объект. …

150 javascript  reactjs  lifecycle 

Я использую React.JS, и когда я делаю react-native run-android(с подключенным устройством), я вижу пустую страницу. Когда я встряхиваю устройство и выбираю Debug JS Remotelyиз списка опций, я вижу следующий экран. FYI: OS: Ubuntu 16.04 Node version is: v4.6.2 java version "1.8.0_111" react": "15.4.1 react-native": "0.38.0

149 android  reactjs  react-native 

Я пытаюсь использовать перехватчики для решения простой проблемы const [personState,setPersonState] = useState({ DefinedObject }); со следующими зависимостями. "dependencies": { "react": "^16.8.6", "react-dom": "^16.8.6", "react-scripts": "3.0.0" } но я все еще получаю следующую ошибку: ./src/App.js Строка 7: React Hook «useState» вызывается в функции «app», которая не является ни компонентом функции React, …

149 reactjs  react-hooks