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

Я пытаюсь заставить ReactJS работать с рельсами с помощью этого руководства. Я получаю эту ошибку: Uncaught ReferenceError: React is not defined Но я могу получить доступ к объекту React в консоли браузера. Я также добавил public / dist / turbo-react.min.js, как описано здесь, а также добавил строку в application.js, как …

89 javascript  ruby-on-rails  reactjs 

Ввод текста выровнен по центру, как исправить этот ввод текста, чтобы он вводился из верхнего левого угла Вот мой CSS для ввода текста /* The Text input is center aligned, how to fix this text input so that it takes input from top left corner */ input: { flex: 1, …

89 javascript  ios  reactjs  react-native 

Я хотел бы знать, как переключить логическое состояние компонента реакции. Например: У меня есть проверка логического состояния в конструкторе моего компонента: constructor(props, context) { super(props, context); this.state = { check: false }; }; Я пытаюсь переключать состояние каждый раз, когда устанавливается мой флажок, используя метод this.setState: <label><input type=checkbox" value="check" onChange …

89 javascript  reactjs  reactjs-flux 

Возможно, я что-то неправильно понял, но useCallback Hook запускается каждый раз, когда происходит повторный рендеринг. Я передал входные данные - в качестве второго аргумента для useCallback - неизменяемые константы - но возвращенный мемоизированный обратный вызов по-прежнему выполняет мои дорогостоящие вычисления при каждом рендеринге (я почти уверен - вы можете проверить …

89 reactjs 

Есть ли способ заставить React Router открывать ссылку в новой вкладке? Я попробовал это, но не вышло. <Link to="chart" target="_blank" query={{test: this.props.test}} >Test</Link> Можно взбить его, добавив что-то вроде onClick="foo"ссылки, как у меня выше, но это приведет к ошибке консоли. Благодарю.

89 reactjs  react-router 

Я переношу проект React с TypeScript для использования функций перехватчиков (React v16.7.0-alpha), но я не могу понять, как установить типизацию деструктурированных элементов. Вот пример: interface IUser { name: string; } ... const [user, setUser] = useState({name: 'Jon'}); Я хочу, чтобы userпеременная была типа IUser. Мое единственное успешное испытание состоит из …

89 reactjs  typescript  react-hooks 

Вот цифры мин + gzip 26k gzip 90 КБ оригинал 450 + k И у React не так много функций в документации. Почему он такой большой? У меня такое ощущение, что это реализация облегченного DOM. Но я хочу быть уверенным.

88 reactjs 

У меня есть модульные тесты для моего reducers. Однако, когда я отлаживаю в браузере, я хочу проверить, правильно ли были вызваны мои действия и было ли соответствующим образом изменено состояние. Я ищу что-то вроде: window._redux.store ... в браузере, чтобы я мог набрать это на консоли и проверить, как идут дела. …

88 javascript  reactjs  redux 

У меня есть некоторые реквизиты, в которых есть строка, которая может содержать такие символы, как &. Он также содержит пробелы. Я хочу заменить все пробелы на  . Есть ли простой способ сделать это? Имейте в виду, что я не могу просто выполнить рендеринг с использованием этого синтаксиса: <div dangerouslySetInnerHTML={{__html: myValue}} …

88 html  reactjs 

Реализую пример из https://github.com/moroshko/react-autosuggest Важный код выглядит так: import React, { Component } from 'react'; import suburbs from 'json!../suburbs.json'; function getSuggestions(input, callback) { const suggestions = suburbs .filter(suburbObj => suburbMatchRegex.test(suburbObj.suburb)) .sort((suburbObj1, suburbObj2) => suburbObj1.suburb.toLowerCase().indexOf(lowercasedInput) - suburbObj2.suburb.toLowerCase().indexOf(lowercasedInput) ) .slice(0, 7) .map(suburbObj => suburbObj.suburb); // 'suggestions' will be an array of strings, …

88 javascript  json  reactjs  webpack 

У меня проблема с использованием response-select. Я использую форму redux, и я сделал свой компонент выбора реакции совместимым с формой redux. Вот код: const MySelect = props => ( <Select {...props} value={props.input.value} onChange={value => props.input.onChange(value)} onBlur={() => props.input.onBlur(props.input.value)} options={props.options} placeholder={props.placeholder} selectedValue={props.selectedValue} /> ); и вот как я это визуализирую: <div …

88 reactjs  default-value  react-select 

У меня есть проект, которого я не трогал 2 недели. Беру обратно и теперь при попытке запустить npm startя получаю эту ошибку. > react-scripts start sh: react-scripts: command not found npm ERR! Darwin 16.0.0 npm ERR! argv "/usr/local/bin/node" "/usr/local/bin/npm" "start" npm ERR! node v6.7.0 npm ERR! npm v3.10.3 npm ERR! …

88 javascript  reactjs  create-react-app 

Пользуюсь Reactи ESLintс eslint-plugin-react. Я хочу , чтобы disableв prop-typesправила в одном файле. var React = require('react'); var Model = require('./ComponentModel'); var Component = React.createClass({ /* eslint-disable react/prop-types */ propTypes: Model.propTypes, /* eslint-enable react/prop-types */ render: function () { return ( <div className="component"> {this.props.title} </div> ); } });

88 reactjs  eslint 

У меня есть аутентификация токена с сервера, поэтому, когда мое приложение Redux загружается изначально, мне нужно сделать запрос на этот сервер, чтобы проверить, аутентифицирован ли пользователь или нет, и если да, я должен получить токен. Я обнаружил, что использование действий INIT ядра Redux не рекомендуется, поэтому как я могу отправить …

88 reactjs  redux 

Используя TypeScript с React, нам больше не нужно расширяться, React.Propsчтобы компилятор знал, что все свойства компонентов React могут иметь дочерние элементы: interface MyProps { } class MyComponent extends React.Component<MyProps, {}> { public render(): JSX.Element { return <div>{this.props.children}</div>; } } Однако, похоже, это не относится к функциональным компонентам без состояния: const …

88 reactjs  typescript