elseif

경고:텍스트 내용이 일치하지 않습니다.서버: "I'm out" 클라이언트: "I'm in" div 사용하고 있다universal-cookieNext.js 프로젝트 및 콘솔에 경고를 반환하는 간단한 코드: import React, { useState } from "react"; import Cookies from "universal-cookie"; import styles from "../styles/Home.module.css"; export default function Home() { const cook = new Cookies(); const [session, setSession] = useState(cook.get("key")); const setCookie = () => { cook.set("k..

반응에서 클래스 전환 메뉴 버튼이 있는 프로젝트에서 리액트를 사용하고 있습니다. Sidenav 컴포넌트는 다음과 같습니다. 그리고 메뉴를 전환하기 위해 다음과 같은 코드를 작성했습니다. class Header extends React.Component { constructor(props){ super(props); this.toggleSidenav = this.toggleSidenav.bind(this); } render() { return ( ) } toggleSidenav() { this.refs.btn.classList.toggle('btn-menu-open'); } componentDidMount() { this.refs.btn.addEventListener('click', this.toggleS..

의 포장을 ★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★」리액트? 오늘 ReactJs를 배우기 시작했고, 1시간 후에 문제에 직면했습니다.페이지의 div 안쪽에 2줄로 된 컴포넌트를 삽입하고 싶습니다.내가 하고 있는 일의 간단한 예를 다음에 나타냅니다. html이 있습니다. .. .. 렌더링 기능은 다음과 같습니다. ... render: function() { return( 10:23:12 MONDAY, 2 MARCH 2015 ) } .... 아래는 렌더입니다. ReactDOM.render(, document.getElementById('component-placeholder')); 생성된 HTML은 다음과 같습니다. .. 10:23:12 MONDAY, 2 MARCH 2015 .. 문제는..

reactj의 인라인 스타일에 벤더 프리픽스를 적용하려면 어떻게 해야 하나요? React 내의 CSS 속성은 벤더 프리픽스와 함께 자동으로 추가되지 않습니다. 예를 들어 다음과 같습니다. Hello World 사파리에서는 로테이션이 적용되지 않습니다. 어떻게 하면 완성할 수 있을까요?React는 벤더 프리픽스를 자동으로 적용하지 않습니다. 벤더 프레픽스를 추가하려면 다음 패턴에 따라 벤더 프레픽스의 이름을 지정하고 다른 프로퍼로 추가합니다. -vendor-specific-prop: 'value' 다음과 같이 됩니다. VendorSpecificProp: 'value' 따라서 질문의 예에서는 다음과 같이 해야 합니다. Hello World 값 접두사는 이 방법으로 수행할 수 없습니다.예를 들어 이 CSS는 ..

ReactJS: onClick 핸들러를 자 컴포넌트에 배치해도 부팅되지 않음 저는 최근에 이 회사와 함께 하기 시작했습니다.ReactJS구체적으로는, 저는,react-rails루비 보석과react-bootstrap구성 요소들. 배치에 대한 질문이 있습니다.onClick이벤트 수신기를 하위 구성요소로 설정합니다. 아래 코드 샘플에서 볼 수 있듯이 부모 컴포넌트는 자 컴포넌트를 호출합니다.render기능.그 안에서render기능, 리액트가 있습니다.onClick가 호출하는 청취자handleToggle를 클릭합니다. ###* @jsx React.DOM ### ToggleIconButton = React.createClass getInitialState: -> toggleOn: false handleToggle..

클래스 컴포넌트에서 React.useRef()를 사용하는 방법 이 코드를 클래스 컴포넌트에 구현해야 합니다.react-toastify와 함께 클래스 컴포넌트의 업로드 진행률을 사용하기 위해서입니다. function Example(){ const toastId = React.useRef(null); function handleUpload(){ axios.request({ method: "post", url: "/foobar", data: myData, onUploadProgress: p => { const progress = p.loaded / p.total; if(toastId.current === null){ toastId = toast('Upload in Progress', { progress: pr..

후크가 반응하는 API 호출은 어디서 할 수 있나요? 으로는 API 은 API에서 합니다.componentDidMount()에서의 라이프 : 리액트 클래스 컴포넌트는 다음과 . componentDidMount(){ //Here we do API call and do setState accordingly } 그러나 React v16.7.0에서 후크가 도입된 후에는 대부분 기능 컴포넌트와 동일합니다. 질문입니다만, 훅이 있는 기능 컴포넌트에서 API 호출을 하려면 정확히 어디서 해야 합니까? componentDidMount() componentDidMount훅이 .useEffect 다른 답변은 API 호출을 어디서 할 수 있는지에 대한 질문에 대한 답변이 아닙니다.은 API를 하여 할 수 .useEffect..

React.js의 부트스트랩모달 부트스트랩 네비게이션 바 및 기타 장소(컴포넌트 인스턴스의 데이터 표시, 즉 "편집" 기능 제공)에서 버튼을 클릭하여 부트스트랩 모달(Modal)을 열어야 하는데, 이 작업을 수행하는 방법을 모르겠습니다.코드는 다음과 같습니다. EDIT: 코드가 갱신되었습니다. ApplicationContainer = React.createClass({ render: function() { return ( ); } }); NavBar = React.createClass({ render: function() { return ( Username ); } }); ScheduleEntryList = React.createClass({ getInitialState: function() { retu..

리액트 후크 : 하위 컴포넌트에서 상위 컴포넌트로 데이터를 전송합니다. 자녀 컴포넌트의 데이터를 부모에게 전달할 수 있는 가장 쉬운 솔루션을 찾고 있습니다. Context, pass trop properties, update 소품 중 어느 것이 가장 좋은 솔루션인지 모르겠습니다. 여러 줄을 선택할 수 있는 테이블이 있는 Child Component를 포함하는 Page Component를 사용하여 관리 인터페이스를 구축하고 있습니다.ChildComponent에서 선택한 라인 수를 부모 PageComponent로 전송하려고 합니다. 뭐 그런 거: 페이지 컴포넌트: count 0 (count should be updated from child) Child Component: const EnhancedTable..

반응 - 상태가 업데이트되지 않음 여기서 설정하려고 합니다.state.autocomplete'hello'를 눌러 인쇄합니다만, 상태는 null인 것 같습니다.어떻게 그럴 수 있죠?setState?data글로벌 변수로 설정됩니다. var data = { populate_at: ['web_start', 'web_end'], autocomplete_from: ['customer_name', 'customer_address'] }; var AutocompleteFromCheckboxes = React.createClass({ handleChange: function(e) { this.setState( { autocomplete_from: 'event.target.value' } ); console.log('au..