«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); //error here event.preventDefault(); } render() …

155 reactjs  typescript 

Prettier 1.7.2 및 Eslint 1.7.0과 함께 vscode를 사용하고 있습니다. 모든 개행 후에 나는 다음을 얻습니다. [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", { "arrays": …

155 reactjs  visual-studio-code  prettier  eslintrc 

최근에 출시 된 iOS 앱 예제 및 문서 만 기본 기능에 반응합니다.

154 android  reactjs  react-native 

그렇다면 이것이 reactjs로 원시 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> ); } }); JSX로 물건을 마크 업하는 멋진 방법이 …

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 

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이 렌더링 될 때까지 기다려야하기 때문에 페이지가로드되는 동안 표시되지 않기 때문입니다. 업데이트 : 스크린 로더를 넣고 index.htmlReact componentDidMount()수명주기 방법으로 제거하여 접근 방식의 예를 만들었습니다 …

150 reactjs  asynchronous  redux 

create-react-app를 사용하고 있습니다. 내 내부 파일에서 내 공용 폴더의 이미지를 호출하려고합니다 src/components. 이 오류 메시지가 나타납니다. ./src/components/website_index.js 모듈을 찾을 수 없음 : 프로젝트 src / 디렉토리 외부에있는 ../../public/images/logo/WC-BlackonWhite.jpg를 가져 오려고했습니다. src / 외부의 상대적 가져 오기는 지원되지 않습니다. src / 내부로 이동하거나 프로젝트의 node_modules /에서 심볼릭 링크를 추가 할 수 …

150 javascript  reactjs  webpack  create-react-app 

rate, sendAmount 및 receiveAmount의 세 가지 입력이 있다고 가정합니다. 3 개의 입력을 useEffect diffing params에 넣었습니다. 규칙은 다음과 같습니다. sendAmount가 변경되면 계산 receiveAmount = sendAmount * rate receiveAmount가 변경되면 계산 sendAmount = receiveAmount / rate 속도를 변경 한 경우, 내가 계산할 receiveAmount = sendAmount * rate때 sendAmount > 0또는 내가 …

150 reactjs  react-hooks 

React.JS를 사용하고 있으며 react-native run-android(장치가 연결된 상태에서) 빈 페이지가 표시됩니다. 장치를 흔들고 Debug JS Remotely옵션 목록에서 선택 하면 다음 화면이 표시됩니다. 참고 사항 : 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"는 React 함수 구성 요소 또는 사용자 지정 React Hook 함수가 아닌 "app"함수에서 호출됩니다. …

149 reactjs  react-hooks 

반응 라우터는 반응 앱이 처리 할 수 ​​있도록 /arbitrary/route합니다. 이것이 작동하려면 일치하는 경로에서 React 앱을 보내려면 서버가 필요합니다. 그러나 webpack dev 서버 는 임의의 엔드 포인트를 처리하지 않습니다. 추가 Express 서버를 사용하는 솔루션이 있습니다. webpack-dev-server가 반응 라우터의 진입 점을 허용하도록 허용하는 방법 그러나 경로 일치를 허용하기 위해 다른 급행 서버를 …

148 reactjs  ecmascript-6  webpack  react-router 

JSBin에서 ReactJS 프레임 워크로 놀고 있습니다. 구성 요소 이름이 소문자로 시작하면 작동하지 않습니다. 예를 들어 다음은 렌더링되지 않습니다. var fml = React.createClass({ render: function () { return <a href='google.com'>Go</a> } }); React.render(<fml />, document.body); 하지만 최대한 빨리 교체로 fml와 Fml는 렌더링 않습니다. 작은 글자로 태그를 시작할 수없는 이유가 있습니까?

148 javascript  reactjs 

현재 reactjs를 사용하여 단일 페이지 응용 프로그램을 작성 중입니다. localStorage를 사용하지 않는 많은 이유는 XSS 취약점 때문이라고 읽었습니다. React가 모든 사용자 입력을 이스케이프하므로 이제 localStorage를 사용하는 것이 안전합니까?

147 reactjs  local-storage  jwt