reactjs- все статьи тега ➜ страница 2
Настройка Airbnb ESLint с React и Webpack
Я пытаюсь настроить пылеобразования со стандартами на JavaScript на Airbnb на мой проект среагировать, он использует webpack. Обновлено последними пакетами на основе комментариев. "babel-eslint": "^6.1.2", "eslint": "^3.2.2", "eslint-config-airbnb": "^10.0.0", "eslint-plugin-import": "^1.12.0", "eslint-plugin-jsx-a11y": "^2.0.1", "eslint-plugin-react": "^6.0.0", "jshint": "^2.9.2", "jshint-loader": "^0.8.3", "json-loader": "^0.5.4", У меня также есть предзагрузчик в конфигурации webpack pr ...
Javascript Promises vs Async Await. Разница?
Я уже использовал функции ES6 и ES7 (благодаря Babel) в своих приложениях - как мобильных, так и веб -. Первый шаг, очевидно, был сделан к уровням ES6. Я узнал много асинхронных паттернов, обещаний (которые действительно многообещающи), генераторов (не уверен, почему символ*) и т. д., Из всего этого обещания вполне соответствовали моим целям. И я довольно часто использую их в своих приложениях. Вот пример / псевдокод того, как я реализовал базовый обещание - var myPromise = new Promise( ...
Как работает connect без mapDispatchToProps
Я читал пример docs для redux и нашел этот пример компонента контейнера. Может кто-нибудь объяснить, почему в данном случае mapDispatchToProps здесь не нужен. Кроме того, как функция получает функцию диспетчеризации? import React from 'react' import { connect } from 'react-redux' import { addTodo } from '../actions' let AddTodo = ({ dispatch }) => { let input return ( <div> <form onSubmit={e => { e.preventDefault() if (!input.value.trim()) { ...
в чем разница между React.HTMLProps и реагировать.HTMLAttributes?
Я пытаюсь определить интерфейс реквизитов для моего компонента и хотел бы, чтобы он включал все общие атрибуты. Но оказалось, что есть два разных интерфейса, которые я могу расширить interface MyProps extend React.HTMLProps<HTMLElement> и interface MyProps extend React.HTMLAttributes<HTMLElement> В чем разница? какой из них я должен использовать? похоже, HTMLProps включает HTMLAttributes, означает ли это, что HTMLProps должны быть лучшими кандидатами? ...
React / Express - 'Unexpected token <' в вызове renderToString()
Я работаю над настройкой рендеринга на стороне сервера для моего приложения React / Express, но я сталкиваюсь с синтаксической ошибкой, связанной с вызовом react-dom/server renderToString() Метод. Я свободно следую этому учебнику - http://crypt.codemancers.com/posts/2016-09-16-react-server-side-rendering/ index.js (Express app root): 'use strict' require('babel-register')({ presets: ['es2015', 'react'] }); const express = require('express') const path = require('path') const app = expr ...
Reactjs создать объявление массива нескольких объектов
Ниже приведен мой код, когда я пытаюсь получить координаты полигона из react-google-maps: const coords = { lat:{}, lng:{} } getCoordinates: () => (polygon) => { const paths = polygon.getPath() const coor = paths.b {coor.map(function(coor, i){ coords.lat= coor.lat() coords.lng= coor.lng() })} return console.log(coords) } Я пытаюсь получить массив объектов для "coords", как показано ниже: coords = [ { lat: 3.1323583333745533, lng: 101.62676453590393 }, { lat: 3 ...
Реагировать родной ошибку "возвращение" зажечь "непойманный при регистрации" с использованием API
Здравствуйте, я все еще новичок в react native, я запутался, как использовать react redux специально для шаблона ignite. Я следую этот учебник https://medium.com/skyshidigital/interaksi-api-dengan-ignite-react-native-f83bf35a23f5. Это мой последний ошибка "неперехваченное при регистрации", "взять(patternOrChannel): patternOrChannel неопределено". Пожалуйста, помогите мне сказать, где находится часть моих кодов, которые дают мне ошибку. Api.js: // a library to wrap and simplify api calls impor ...
Reactjs, Typescript-свойство не существует в дочернем компоненте
Я использую typescript 2.3.4 с React. Я получаю ошибку TS2339: ошибка TS2339: свойство 'name' не существует на типе ' Readonly & Только Для Чтения'. Ошибка возникает, когда я пытаюсь объявить свойство в дочернем компоненте. Как правильно ссылаться на свойство в дочернем компоненте? По какой-то причине код не выполняется в script runner. Любая помощь ценится. export interface person { name: string; age: number; } interface State { personArray: person[]; } inter ...
Определение и экспорт HOC в React
Я исследовал компоненты более высокого порядка в react. Мое требование состоит в том, что у меня есть набор компонентов, которые мне нужно расширить, чтобы дать им больше функциональности без перезаписи всего компонента. В этом случае я обнаружил концепцию HOC в react, где можно расширить компонент, используя чистую функцию. Мой вопрос заключается в том, Могу ли я экспортировать расширенный компонент как обычный компонент. Для примера Компонент, который должен быть расширен class foo extend ...
Как запустить React-Native примеры?
Я не могу найти никаких инструкций о том, как установить и запустить один из других примеров, приведенных в 'https://github.com/facebook/react-native/tree/master/Examples 'такие как' https://github.com/facebook/react-native/tree/master/Examples/Movies'. Учебник только говорит вам делать react-native init AwesomeProject Который захватывает ' https://github.com/facebook/react-native/tree/master/Examples/SampleApp'. Если я клонирую весь "react-native" репозиторий, а затем выполнить npm ins ...
Работа с вложенными ролей и разрешений в реагируют возвращение
Мой вопрос больше о том, как вы получаете список ролей для вашего приложения React для приложения, в котором пользователь может иметь вложенный набор ролей и разрешений. Вы отправляете весь список разрешений/дерево для пользователя вперед, когда они входят в систему, а затем прячете это, чтобы вы могли повторить его после этого? Например, предположим, что пользователь находится в роли 1 и роль 1 имеет набор разрешений, но они также находятся в нескольких других ролях или могут даже быть подр ...
ReactJS-как я могу реализовать разбиение на страницы для react с сохранением состояния при изменении маршрута?
У меня есть приложение react, я использую react-router V. 4 и использую pagination от Jason. http://jasonwatmore.com/post/2017/03/14/react-pagination-example-with-logic-like-google Все работает нормально. Во всяком случае, когда я изменяю маршрут, а затем изменяю маршрут обратно, разбиение на страницы меняет текущую страницу обратно на страницу 1. Как сохранить состояние страницы при изменении маршрута? ...
Где объявить переменную в react js
Я пытаюсь объявить переменную в классе react-js. Переменная должна быть доступна в различных функциях. Это мой код class MyContainer extends Component { constructor(props) { super(props); this.testVarible= "this is a test"; // I declare the variable here } onMove() { console.log(this.testVarible); //I try to access it here } } Onmove, значение этого.тест не определен. Я знаю, что я мог бы поставить значение на состояние, но я не хочу этого делать, пот ...
Добавление Google Analytics в React
Я пытаюсь добавить Google Analytics в веб-приложение React. Я знаю, как это сделать на сайтах HTML/CSS/JS, и я также интегрировал его в приложение AngularJS. Но я не совсем уверен, как это сделать, когда дело доходит до реакции. С помощью HTML / CSS/JS я только что добавил его на каждую страницу. То, что я сделал с AngularJS, было добавление скрипта GTM и GA в индекс.html и добавил UA-метки к HTML-дивам (и кнопкам), чтобы получить клики. Как я могу это сделать с реактом? Пожалуйста, помог ...
Изменение состояния другого компонента-ReactJS
Я пытаюсь построить простое приложение, используя react, которое имеет два компонента, один из которых встроен в другой. Дочерний компонент-это сокращенное меню, и при нажатии на него оно расширяется. Я хочу иметь возможность повторно сжимать его, когда родительский элемент щелкается или когда дочерний элемент теряет фокус. Вот как выглядит родительский компонент: import React from 'react'; import MenuBar from './_components/MenuBar.js'; var div = React.createFactory('div'); var menu = React ...
Почему иногда render вызывается сразу после setState, а иногда нет
Вот мои коды: class TestState extends Component{ constructor(props){ super(props); this.state={ text:"123" } this._hello = this._hello.bind(this) } _hello(){ console.log("guangy will set state..."); let num = Math.floor(Math.random()*100); this.setState({text: ""+num }); console.log("guangy after set state..."); } componentWillUpdate(){ console.log("guangy componentWillUpdate") } ...
Как сделать IntelliJ IDEA resolve webpack requires out of node modules directory?
IntelliJ не может разрешить модули javascript, вызываемые с помощью Webpack requires, которые не находятся в каталоге node_modules Представьте себе такую структуру проекта: `- project |- node_modules | `- react | `- addons.js |- webpack.config.js |- util | `- tool.js `- src |- components | `- uno.jsx `- two.jsx Это мой webpack config // webpack.config.js var path = require('path'); module.exports = { resolve: { root: [ path.resol ...
Как использовать React.Дети.карта с реактом.клонеэлемент с [email protected]
Если я ввожу дочерние элементы родительского компонента как Node, то это говорит о том, что children является неправильным типом для передачи в React.Children.map. Однако, если я введу его как ChildrenArray<any>, то он говорит, что тип, который я передаю React.cloneElement, неверен. Сценарий 1: import * as React from 'react'; type Props = { children?: React.ChildrenArray<any>, }; class Test extends React.Component<Props> { props: Props; render() { return React.Ch ...
React PropTypes не требуется показывать
У меня есть эти PropTypes Настройки: Select.propTypes = { onSelect: PropTypes.func.isRequired, data: PropTypes.arrayOf(PropTypes.shape({ key: PropTypes.string.isRequired, value: PropTypes.string.isRequired }).isRequired).isRequired } onSelect и data оба будут показывать ошибки, если они не определены. Однако форма объекта в массиве данных, не является валидирующей. Я могу использовать data={[]}, и это не ошибка. Есть ли что-то, что я упускаю здесь? Спасибо ...
react native-приложение вылетает, когда идет в фоновом режиме (нет ошибки в журнале)
У меня есть список звуковых элементов в FlatList и я использую реагировать родной аудио-инструментарий играть в них. У меня есть экземпляр игрока в дочернем компоненте. По какой-то причине, когда я минимизирую приложение, приложение вылетает без какой-либо ошибки в react-native log-android. Я не знаю, как это отладить. Есть ли способ найти причину этой ошибки? Я не уверен, с какой командой использовать --stacktrace, если бы я мог. Кроме того, я уверен, что это связано с игроком в react-native- ...