«reactjs» 태그된 질문

React는 http://facebook.github.io/react/docs/jsx-gotchas.html에 설명 된대로 사용자 정의 속성을 렌더링 할 수 있습니다 . 사용자 정의 속성을 사용하려면 접두사로 data-를 붙여야합니다. <div data-custom-attribute="foo" /> 그리고 이벤트 객체에서 액세스 할 수있는 방법을 찾을 수 없다는 것을 제외하고는 좋은 소식입니다. render: function() { ... <a data-tag={i} style={showStyle} onClick={this.removeTag}></a> ... removeTag: function(event) { this.setState({inputVal: event.target????}); …

214 javascript  facebook  reactjs 

React에서 객체를 명확하게 생성하고 인라인 스타일로 할당 할 수 있습니다. 즉. 아래에 언급. var divStyle = { color: 'white', backgroundImage: 'url(' + imgUrl + ')', WebkitTransition: 'all', // note the capital 'W' here msTransition: 'all' // 'ms' is the only lowercase vendor prefix }; var divStyle2 = {fontSize: '18px'}; React.render(<div …

214 reactjs 

페이스 북의 ReactJS를 다루는데 어려움을 겪고 있습니다. 아약스를하고 html 데이터를 표시하려고 할 때마다 ReactJS는 텍스트로 표시합니다. (아래 그림 참조) jquery Ajax의 성공 콜백 기능을 통해 데이터가 표시됩니다. $.ajax({ url: url here, dataType: "json", success: function(data) { this.setState({ action: data.action }) }.bind(this) }); 이것을 html로 변환하는 쉬운 방법이 있습니까? ReactJS를 사용하여 …

212 javascript  jquery  ajax  reactjs 

자식 구성 요소에 2 개의 값을 전달합니다. 표시 할 객체 목록 기능을 삭제하십시오. .map () 함수를 사용하여 객체 목록을 표시합니다 (react tutorial 페이지에 제공된 예제와 같이). 그러나 해당 구성 요소의 버튼은 onClick렌더링시 함수를 시작합니다 (렌더링 시간에는 실행되지 않아야 함). 내 코드는 다음과 같습니다 module.exports = React.createClass({ render: function(){ var taskNodes …

212 javascript  reactjs  button  onclick  dom-events 

ReactNative에서 텍스트를 가로 및 세로로 가운데 맞추는 방법은 무엇입니까? rnplay.org에 예제 응용 프로그램이 있는데 justifyContent = "center" 및 alignItems = "center" 가 작동하지 않습니다. https://rnplay.org/apps/AoxNKQ 텍스트가 가운데에 있어야합니다. 왜 텍스트 (노란색)와 부모 컨테이너 사이에 여백이 있습니까? 암호: 'use strict'; var React = require('react-native'); var { AppRegistry, StyleSheet, Text, Image, View, …

212 reactjs  flexbox  react-native 

내 프로젝트는 create-react-app 기반입니다 . npm start또는 yarn start기본적으로 포트 3000 에서 응용 프로그램을 실행 하며 package.json에 포트를 지정하는 옵션이 없습니다. 이 경우 원하는 포트를 어떻게 지정합니까? 이 프로젝트 중 두 개를 동시에 테스트하기 위해 포트 하나 3005와 다른 하나는3006

212 reactjs  npm 

React를 배우는 데 시간을 보낸 후 구성 요소를 만드는 두 가지 주요 패러다임의 차이점을 이해합니다. 내 질문은 언제 어느 것을 사용해야 하는가? 다른 것의 장점 / 무역은 무엇입니까? ES6 수업 : import React, { Component } from 'react'; export class MyComponent extends Component { render() { return ( <div></div> ); …

211 javascript  reactjs  ecmascript-6  redux 

에서 일할 때 매우 혼란스러워하는 것이 있습니다 React. 인터넷 .js에는 반응이있는 파일 을 사용하는 많은 예제 가 있지만 다른 많은 .jsx파일을 사용 합니다. .jsx파일 에 대해 읽었 으며 내 이해는 파일 안에 html 태그를 작성할 수 있다는 것 javascript입니다. 그러나 .js파일에도 같은 내용을 쓸 수 있습니다 . 그래서이 두 가지 …

211 reactjs  jsx 

다음과 같이 자식 구성 요소에서 부모 구성 요소로 데이터를 보내려고합니다. const ParentComponent = React.createClass({ getInitialState() { return { language: '', }; }, handleLanguageCode: function(langValue) { this.setState({language: langValue}); }, render() { return ( <div className="col-sm-9" > <SelectLanguage onSelectLanguage={this.handleLanguage}/> </div> ); }); 다음은 자식 구성 요소입니다. export const SelectLanguage = React.createClass({ getInitialState: …

211 reactjs 

useEffect는 훅이 모든 변화 기능에 전달 실행할 반응한다. 원하는 속성이 변경 될 때만 호출되도록 최적화 할 수 있습니다. 초기화 함수를 componentDidMount호출하고 변경시 다시 호출하지 않으 려면 어떻게해야 합니까? 엔터티를로드하려고하지만로드 기능에 구성 요소의 데이터가 필요하지 않다고 가정 해 봅시다. useEffect후크를 사용하여 어떻게 만들 수 있습니까? class MyComponent extends React.PureComponent { componentDidMount() …

210 javascript  reactjs  react-hooks 

현재 React JS 및 React Native 프레임 워크 에서 작업하고 있습니다. 절반의 길에서 나는 Facebook의 Flux 및 Redux 구현에 대해 읽을 때 Immutability 또는 Immutable-JS 라이브러리를 발견했습니다 . 문제는 왜 불변성이 그렇게 중요한가? 객체를 돌연변이시키는 데 무엇이 잘못 되었습니까? 간단하지 않습니까? 예를 들어, 시작 화면이 뉴스 헤드 라인의 목록보기 인 …

205 javascript  reactjs  functional-programming  immutability  immutable.js 

react.js에서 특정 막대를 어떻게 선택합니까? 이것은 내 코드입니다. var Progressbar = React.createClass({ getInitialState: function () { return { completed: this.props.completed }; }, addPrecent: function (value) { this.props.completed += value; this.setState({ completed: this.props.completed }); }, render: function () { var completed = this.props.completed; if (completed < 0) { completed = 0 …

205 javascript  reactjs  getelementbyid 

React 에서이 두 구현 사이에 실제 차이점이 있습니까? 어떤 친구들은 FirstComponent가 패턴이라고 말하지만 그 이유는 모르겠습니다. 렌더링이 한 번만 호출되므로 SecondComponent가 더 단순 해 보입니다. 먼저: import React, { PropTypes } from 'react' class FirstComponent extends React.Component { state = { description: '' } componentDidMount() { const { description} = …

204 javascript  reactjs  components 

나는 Bootstrap을 처음 사용 하고이 문제에 봉착했습니다. 입력 필드가 있고 한 자리를 입력하자마자 from 함수 onChange가 호출되지만 정수가 입력되면 'Enter'를 누를 때 호출되기를 원합니다. 유효성 검사 기능과 동일한 문제-너무 빨리 호출됩니다. var inputProcent = React.CreateElement(bootstrap.Input, {type: "text", //bsStyle: this.validationInputFactor(), placeholder: this.initialFactor, className: "input-block-level", onChange: this.handleInput, block: true, addonBefore: '%', ref:'input', …

204 javascript  twitter-bootstrap  reactjs 

axios POST요청이 컨트롤러의 URL에 충돌하지만 null 값을 POJO 클래스로 설정하고 크롬에서 개발자 도구를 사용할 때 페이로드에 데이터가 포함됩니다. 내가 뭘 잘못하고 있죠? Axios POST 요청 : var body = { userName: 'Fred', userEmail: 'Flintstone@gmail.com' } axios({ method: 'post', url: '/addUser', data: body }) .then(function (response) { console.log(response); }) .catch(function (error) …

204 reactjs  react-redux  axios  ajaxform  axios-cookiejar-support