lovecheck

.jsx 파일과 .js 파일의 기술적인 차이점은 무엇입니까? 그 기술적 차이를 이해하고 적절한 사용을 결정하고 싶습니다. 이 두 가지 모두 동일한 콘텐츠를 가질 수 있고 일부 프로젝트에서 서로 바꿔 사용할 수 있다는 것을 깨달았습니다. 어떻게요?.jsx파일이 다르다.js?신규 사용자용 업데이트 JSXtransformer가 폐지되어 JSX 컴파일러 도구가 제거되었습니다.리액트 팀은 Babel REP와 같은 다른 도구를 사용할 것을 권장합니다. 유지보수가 용이하도록 JSX 소스 코드를 그대로 유지하고 싶다면 다음과 같이 유지합니다..jsx수동으로 또는 빌드 스크립트를 통해 JSX 컴파일러를 사용하면 JSX 구문이 일반 JavaScript 파일로 변환됩니다. 주의: 실제 가동 환경에서는 JSX 파일을 제공할 ..

React를 사용하여 재료 UI 대화 상자에서 양식을 제출하는 방법JS 재료 UI 대화상자를 사용하여 양식 목록을 만들었습니다.공식 사례: This dialog spans the entire width of the screen. 액션은 다음과 같습니다. const actions = [ , , ]; 양식을 작성하고 Dialog가 양식 데이터를 제출하도록 하려면 어떻게 해야 합니까? ------------------------------------------------------------------------------------------------- 또 다른 답이 있습니다. 의 속성을 추가합니다.type그리고.form[ Dialog actions ]버튼: const actions = [ , , ]; 대..

React 문서에서는 componentWillMount가 아닌 componentDidMount에서 AJAX를 실행할 것을 권장하는 이유는 무엇입니까? 왜 그런지 알겠다componentDidMount는, DOM 액세스가 필요한 모든 것에 적합합니다만, AJAX 요구에는, 통상, 반드시 필요한 것은 아닙니다. 왜 그러고 있어?componentDidMount부작용입니다.이벤트 리스너 추가, AJAX, DOM 변환 등 componentWillMount는 거의 도움이 되지 않습니다.특히 서버측 렌더링에 관심이 있는 경우(이벤트 리스너로 인해 에러나 누수가 발생하거나 기타 많은 문제가 발생할 수 있습니다). 제거에 대한 이야기가 있다.componentWillMount클래스 컴포넌트로부터 액세스 할 수 있습니다.이것..

React.js에서 CSV 파일을 업로드하고 읽는 방법은 무엇입니까? 사용자가 .csv 파일을 업로드한 후 브라우저로 해당 파일의 데이터를 해석할 수 있도록 하고 싶습니다.React JS를 사용하고 있습니다.이게 어떻게 작동할까요?감사해요.알아냈어.react-file-reader와 HTML5의 FileReader의 조합(이 페이지 참조). 렌더 내부에 react-file-reader 비트를 배치했습니다. Upload 그리고 위에 이거. handleFiles = files => { var reader = new FileReader(); reader.onload = function(e) { // Use reader.result alert(reader.result) } reader.readAsText(file..

Jest - SyntaxError: 모듈 외부에서 Import 문을 사용할 수 없습니다. 사용하고 있다jest:24.9.0create-module-app에서 글로벌하게 설치됩니다.이 파일들 중에서 저는 es6 모듈을 사용하고 있습니다.사용 시 오류는 없습니다."test": "react-scripts test" 그러나 내가 사용으로 이동했을 때jest와 함께"test": "jest --config jest.config.js",이하의 에러가 표시됩니다. FAIL src/configuration/notifications.test.js ● Test suite failed to run /var/www/management/node/src/configuration/notifications.test.js:1 ({"Ob..

react-icons 패키지에서 글꼴 표시 아이콘을 확대(크게)하는 방법 저는 marvelouse react-icons 패키지(http://gorangajic.github.io/react-icons/fa.html),를 사용하고 있으며, 특히 폰트 awesome 패키지를 사용하고 있습니다. 이것이 반응하지 않으면 태그에 다음과 같은 속성을 추가합니다. 단, Fa-5x를 FaFolderOpen 태그에 추가하면 아무것도 동작하지 않습니다.보시는 바와 같이 리액트 부트스트랩을 사용하여 아이콘을 버튼(블록으로 해야 합니까? 이전에 물어본 적이 있는 것 같지만, 검색으로는 찾을 수 없었습니다. 이렇게 생겼는데 더 크게 하고 싶어요. const React = require('react') import { Form, ..

Swift를 React-Native로 브리징할 때 "인식된 Objective-C 메서드가 아닙니다"가 표시됨 이 가이드에 따라 React-Native 0.33 코드를 매우 간단한 Swift 메서드에 브리지하려고 합니다만, 얻을 수 있는 것은 이것뿐입니다.show:(NSString *)name is not a recognized Objective-C method. 제 코드는 다음과 같습니다. Switch Manager.swift import Foundation @objc(SwitchManager) class SwitchManager: NSObject { @objc func show(name: String) -> Void { NSLog("%@", name); } } Switch Manager Bridge.h..

!react에서 중요한 인라인 스타일 !important override를 사용하여 인라인 스타일을 추가하는 방법이 있습니다. style={ height: 20+'!important' }; 이건 내가 기대했던 대로 되지 않는다. 리액트는 이 기능을 지원하지 않는 것 같습니다.하지만 내가 조사를 하면서 해킹을 당했어 { if (node) { node.style.setProperty("float", "right", "important"); } }}> 행운을 빈다:)20+'!important'이'20!important'. 숫자만 지정하면 react에 의해 "px"가 추가됩니다.단, 문자열을 사용하고 있기 때문에 단위를 지정해야 합니다.또, 「!important」와 그 왼쪽에 있는 「!important」 사이에..

리액트/타이프스크립트의 소품으로 열거를 사용하는 방법 다음과 같은 것이 있습니다. export enum Sizes{ Small, Large } 내 몸에 익숙해지고 있어컴포넌트의 소품 인터페이스: export interface IProps{ Label?: string; Size: SizeEnum; } 궁금한 건 이걸 쓸 때?enum 값은 다른 컨텍스트와 마찬가지로 참조할 수 있습니다. export enum Sizes{ Small, Large } export interface IProps{ Label?: string; Size: Sizes; } class Demo extends React.Component {} let d = 사용하다type또는as const 둘다요.type그리고.as constauto-fi..

ReactJS - 커스텀이벤트 리스너 컴포넌트에 추가 일반 오래된 HTML에서는 DIV가 있습니다. 및 다음 Javascript 코드 var myMovie = document.getElementById('my_movie'); myMovie.addEventListener('nv-enter', function (event) { console.log('change scope'); }); 이제 이 컴포넌트 안에 리액트 컴포넌트가 있고 렌더링 메서드에서 div를 반환합니다.커스텀 이벤트에 이벤트청취자를 추가하려면 어떻게 해야 하나요? (이 라이브러리를 TV 앱에 사용하고 있습니다 - 네비게이션 ) import React, { Component } from 'react'; class MovieItem extends..