megabox

리액트 리플릿 맵이 올바르게 표시되지 않음 사용하려고 합니다.react-leaflet맵을 표시합니다.동작하고 있는 이 바이올린의 코드를 사용하고 있습니다만, 제 컴퓨터에는 이 출력이 있습니다. 제 코드는 다음과 같습니다. DeviceMap.js import React from 'react' import { Map, Marker, Popup, TileLayer } from 'react-leaflet'; export class DeviceMap extends React.Component { constructor() { super(); this.state = { lat: 51.505, lng: -0.09, zoom: 13, }; } render() { const position = [this.state.lat..

ReactJs: 여러 번 버튼 누름 방지 리액트 컴포넌트에는 클릭 시 AJAX를 통해 데이터를 전송하는 버튼이 있습니다.처음 사용 후 버튼을 비활성화해야 하는 경우 등 처음만 수행해야 합니다. 이 작업을 수행하는 방법: var UploadArea = React.createClass({ getInitialState() { return { showUploadButton: true }; }, disableUploadButton(callback) { this.setState({ showUploadButton: false }, callback); }, // This was simpler before I started trying everything I could think of onClickUploadFile()..

리액트 라우터를 사용하여 페이지를 새로고침하려면 어떻게 해야 하나요? 이 파일(https://github.com/ReactTraining/react-router/blob/v0.13.3/modules/createRouter.js)에는 리프레시 기능이 있는 것을 알 수 있습니다만, 어떻게 불러야 할지 모르겠습니다.리액트 라우터는 처음이라 hashHistory를 사용하여 몇 번 페이지 사이를 이동하는 데만 사용해 왔습니다. 현재 설치 실패 시 사용자가 재시도할 수 있도록 이 옵션을 사용하려고 합니다.이 옵션은 설치가 이루어진 페이지(사용자가 현재 표시되어 있는 페이지)를 새로 고침으로써 실행할 예정입니다.어떤 도움이라도 주시면 감사하겠습니다. 웹 앱이 아닌 전자로 실행되는 노드 앱입니다.첫째, 의존관계로서 반..

반응 - HTML 태그를 소품으로 넘기는 방법 다음과 같이 HTML 태그로 텍스트를 전달할 수 있으면 좋겠습니다. 지지 of of of of of of of 의 내부MyComponent 방식,시, 인쇄 this.props.text이치 This is not working. 리액트 파스를 HTML로 만들어 적절히 폐기할 수 있는 방법이 있습니까?문자열과 JSX 요소가 혼재된 배열을 사용할 수 있습니다(여기에 있는 문서를 참조하십시오). 동작하는 것을 나타내는 바이올린이 여기 있습니다.http://jsfiddle.net/7s7dee6L/ 또한 마지막 수단으로 항상 원시 HTML을 삽입할 수 있지만 속성 값을 삭제하지 않으면 사이트 간 스크립팅(XSS) 공격이 발생할 수 있으므로 주의하십시오.사실 그렇게 하는 ..

여러 함수를 호출 on클릭 리액트JS vanilla JavaScript에서는 다음을 수행할 수 있습니다. onclick="f1();f2()" 2개의 함수 호출에 해당하는 것은 무엇입니까?onClick리액트 JS에서요? 하나의 함수를 호출하는 것은 다음과 같습니다. onClick={f1} 2+ 함수 호출을 다른 함수/메서드로 래핑합니다.다음은 이 아이디어의 몇 가지 변형입니다. 1) 분리 방법 var Test = React.createClass({ onClick: function(event){ func1(); func2(); }, render: function(){ return ( Test Link ); } }); 또는 ES6 클래스: class Test extends React.Component { on..

React 컴포넌트 상태로 객체를 저장하시겠습니까? React 컴포넌트 상태로 객체를 저장할 수 있습니까?[Yes]의 경우 다음 명령을 사용하여 해당 개체의 키 값을 변경하려면 어떻게 변경할 수 있습니까?setState구문적으로 다음과 같이 쓸 수 없다고 생각합니다. this.setState({ abc.xyz: 'new value' }); 비슷한 맥락에서 또 다른 질문이 있습니다.변수 세트를 React 컴포넌트에 저장하지 않고 컴포넌트의 어떤 방법으로도 사용할 수 있도록 해도 될까요? 컴포넌트에 메서드를 선언할 때와 마찬가지로 이러한 변수를 모두 포함하는 단순한 개체를 생성하여 컴포넌트 수준에 배치할 수 있습니다. 코드에 많은 비즈니스 로직을 포함하고 여러 가지 방법으로 값이 변경된 많은 변수를 사용해야..

오브젝트의 getter 함수를 Jest로 모킹/바꾸는 방법 Sinon에서는 다음을 수행할 수 있습니다. var myObj = { prop: 'foo' }; sinon.stub(myObj, 'prop').get(function getterFn() { return 'bar'; }); myObj.prop; // 'bar' 하지만 내가 어떻게 제스트에게 똑같이 할 수 있을까?함수를 덮어쓸 수 없습니다.jest.fn()getter를 대체할 수 없기 때문에 "get 값을 설정할 수 없음" Jest 22.1.0은 이 답변을 우연히 접한 다른 사용자를 위해 getter 및 setter 메서드를 감시하는 기능을 도입했습니다. 편집: 아래 scieslak의 답변과 같이 getter 및 setter 메서드를 감시할 수 있기..

Next.js에서 "필요한 매개 변수(id)가 getStaticPaths에서 문자열로 제공되지 않았습니다" 오류가 발생했습니다. 에 문제가 있습니다.getStaticPaths기능.파라미터를 사용하여 다이내믹 디스플레이를 가져오려고 하면, getStaticPaths for / movies / [ id ]에서 필수 파라미터(id)가 문자열로 제공되지 않았습니다만, 위의 방법을 사용하면 동작합니다.무엇보다도 나는 서류다. import fetch from 'node-fetch'; function MovieSelect({movie}){ return( Test: {movie.name} {movie.summary.replace(//g, '')} {movie.image ? : null} ) } export async ..

typescript-eslint/parser를 버전 4.0.0으로 업그레이드하기 때문에 eslint가 JSX 또는 일부 react @types가 정의되지 않았다고 간주하는 이유 컨텍스트는 eslint 규칙에 따라 이 eslint 구성을 사용하여 ReactJs를 구축한 매우 큰 프로젝트입니다. const DONT_WARN_CI = process.env.NODE_ENV === 'production' ? 0 : 1 module.exports = { extends: [ 'eslint:recommended', 'plugin:jsx-a11y/recommended', 'plugin:react/recommended', 'prettier', 'prettier/@typescript-eslint' ], plugins: [ ..

TailwindCss에서 클래스 이름을 동적으로 빌드합니다. 현재 TailwindCss로 다음 프로젝트를 위한 컴포넌트 라이브러리를 구축하고 있는데 Button 컴포넌트 작업 중에 작은 문제가 발생했습니다. 'primary' ★★★★★★★★★★★★★★★★★」'secondary'합니다.tailwind.config.js 이 을 '' 해 보겠습니다.Template literalsbg-${color}-500 {children} 은 브라우저 되며, '클래스 이름'이 됩니다.bg-primary-500적용된 스타일 탭에는 표시되지 않습니다. 테마는 다음과 같이 설정됩니다. theme: { extend: { colors: { primary: { 500: '#B76B3F', }, secondary: { 500: '#34..