Запитання з тегом «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: ' + this.state.value); …

155 reactjs  typescript 

Нещодавно запущені реагують на рідні функції, лише приклад програми iOS та iOS.

154 android  reactjs  react-native 

Тож це єдиний спосіб вивести сирий html за допомогою reactjs? // 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 

Я не можу зрозуміти, як встановити значення властивостей за замовчуванням для моїх компонентів за допомогою Typescript. Це вихідний код: class PageState { } export class PageProps { foo: string = "bar"; } export class PageComponent extends React.Component<PageProps, PageState> { public render(): JSX.Element { return ( <span>Hello, world</span> ); } } …

153 reactjs  typescript  tsx 

Я хочу запитати, що означає і робить останнє речення (експортувати за замовчуванням HelloWorld;), але я не можу знайти підручники з цього приводу. // hello-world.jsx import React from 'react'; class HelloWorld extends React.Component { render() { return <p>Hello, world!</p>; } } export default HelloWorld;

153 javascript  reactjs 

Я використовую vscode з Prettier 1.7.2 та Eslint 1.7.0. Після кожного нового рядка я отримую: [eslint] Delete 'cr' [prettier/prettier] Це файл .eslintrc.json: { "extends": ["airbnb", "plugin:prettier/recommended"], "env": { "jest": true, "browser": true }, "rules": { "import/no-extraneous-dependencies": "off", "import/prefer-default-export": "off", "no-confusing-arrow": "off", "linebreak-style": "off", "arrow-parens": ["error", "as-needed"], "comma-dangle": [ "error", { …

153 reactjs  visual-studio-code  prettier  eslintrc 

class PlayerControls extends React.Component { constructor(props) { super(props) this.state = { loopActive: false, shuffleActive: false, } } render() { var shuffleClassName = this.state.toggleActive ? "player-control-icon active" : "player-control-icon" return ( <div className="player-controls"> <FontAwesome className="player-control-icon" name='refresh' onClick={this.onToggleLoop} spin={this.state.loopActive} /> <FontAwesome className={shuffleClassName} name='random' onClick={this.onToggleShuffle} /> </div> ); } onToggleLoop(event) { // "this …

152 javascript  reactjs  this 

Це приклад зі сторінки додатків Google Adsense. Екран завантаження, що відображається до того, як головна сторінка з’явилася після. Я не знаю, як зробити те ж саме з React, оскільки якщо я зроблю екран завантаження, виконаний компонентом React, він не відображається, коли сторінка завантажується, тому що вона повинна чекати, коли DOM …

150 reactjs  asynchronous  redux 

Я використовую додаток create-react. Я намагаюся викликати зображення з моєї загальнодоступної папки з файлу всередині мого src/components. Я отримую це повідомлення про помилку ./src/components/website_index.js Модуль не знайдено: Ви намагалися імпортувати ../../public/images/logo/WC-BlackonWhite.jpg, який не входить у проект src / каталог. Відносний імпорт за межами src / не підтримується. Ви можете або …

150 javascript  reactjs  webpack  create-react-app 

Скажімо, у мене є 3 входи: rate, sendAmount і acceptAmount. Я поставив, що 3 входи на useEffect відрізняються парами. Правила такі: Якщо sendAmount змінився, я обчислюю receiveAmount = sendAmount * rate Якщо прийом змінено, я підрахував sendAmount = receiveAmount / rate Якщо показник змінився, я обчислюю, receiveAmount = sendAmount * …

150 reactjs  react-hooks 

Я використовую 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 

Маршрутизатор React дозволяє реагувати додаткам для обробки /arbitrary/route. Для того, щоб це працювало, мені потрібен мій сервер, щоб надіслати додаток React будь-яким зібраним маршрутом. Але сервер розробників webpack не обробляє довільних кінцевих точок. Тут є рішення за допомогою додаткового експрес-сервера. Як дозволити веб-пакету-dev-серверу дозволити вхідні точки від react-router Але я …

148 reactjs  ecmascript-6  webpack  react-router 

Я граю разом із рамкою ReactJS на JSBin . Я помітив, що якщо назва мого компонента починається з малої літери, це не працює. Наприклад, таке не відображається: var fml = React.createClass({ render: function () { return <a href='google.com'>Go</a> } }); React.render(<fml />, document.body); Але як тільки я замінити fmlз Fmlнею …

148 javascript  reactjs 

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

148 reactjs  react-hooks 

Зараз я будую додаток на одній сторінці за допомогою reactjs. Я читав, що багато причин невикористання localStorage пов’язані з уразливістю XSS. Оскільки React уникає всіх даних користувачів, чи стало б безпечно використовувати localStorage?

147 reactjs  local-storage  jwt