jooyon

문자열을 jsx로 변환하려면 어떻게 해야 합니까? 문자열을 어떻게 변환하면jsx예를 들어, 에서 문자열을 가져오면textarea, 어떻게 변환하면React요소 var jsxString = document.getElementById('textarea').value; 클라이언트 상에서 이것을 변환하려면 어떻게 해야 합니까?가능합니까?React 애트리뷰트의 사용을 검토할 수 있습니다.dangerouslySetInnerHTML: class YourComponent{ render() { someHtml = 'blablablaanother blbla' return ( ) } } 개인적으로, 나는 이전 답변에서와 같이 그것을 하는 것을 좋아합니다. 앞의 답변에서 권장한 것처럼dangerouslySetInnerHTML..

JSX에서 부울 값을 렌더링할 수 없습니까? JSX 내에서 부울 값을 렌더링하려고 하는데, React가 표현식으로 평가하고 컴포넌트가 반환된 후 아무것도 반환하지 않습니다. 이 문제를 해결할 방법이 있나요? 여기 예가 있습니다. var ipsumText = true; ReactDOM.render( Boolean Value: {ipsumText} , document.getElementById('impl') ); 컴파일된 HTML을 다음과 같이 표시합니다. Boolean Value: 편집: 다음은 예시의 JSBin 링크입니다.http://jsbin.com/nibihodoce/1/edit?html,js,output 편집 2: 이미 .toString()의 대체 방법을 탐색했습니다만, 개체의 배열에 대해 반복하고..

기존 create-react-app 앱에 TypeScript 추가 기존 create-react-app 응용 프로그램에 TypeScript를 추가하는 데 문제가 있습니다.이전에는 프로젝트를 시작하기 전에 항상 추가해 왔습니다.단순히 다음과 같습니다.create-react-app my-app --scripts-version=react-scripts-ts근데 지금은 안 돼요. 여기서 찾은 유일한 "솔루션"은 다음과 같습니다. 임시 프로젝트 생성:react-scripts-ts 알았다.tsconfig.json,tsconfig.test.json,tslint.json임시 프로젝트 src 폴더에서 프로젝트의src폴더입니다. 인package.json에 대한 모든 참조를 변경합니다.react-scripts로.react-s..

반응 탐색 5에서 매개 변수로서의 통과 함수 메모: 이 쿼리는 반응 탐색 5에 대한 것입니다. 리액트 네비게이션4에서는 네비게이션을 하는 동안 함수를 파라미터로 전달할 수 있지만 리액트 네비게이션5에서는 시리얼화 파라미터에 대한 경고를 보냅니다. 기본적으로는 부모 화면에서 자녀 화면으로 이동하여 새로운 값을 얻고 부모 화면 상태를 업데이트하려고 합니다. 현재 구현 방법은 다음과 같습니다. 상위 화면 _onSelectCountry = (data) => { this.setState(data); }; . . . Navigation.navigate("CountrySelect", { onSelect: this._onSelectCountry, countryCode: this.state.country_code, })..

ReactJs CreateClass가 함수가 아닙니다. var React = require('react'); module.exports=React.createClass({ render:function(){ return( the list )} }) 위의 코드를 실행하면 다음 오류가 나타납니다. app.js:4 Uncaught TypeError: React.createClass is not a function 버전 차이 때문인가요, 오타 때문인가요? package.json-I have included create-react-class as seen here but not in the bower.json file { "dependencies": { "browser-sync": "^2.18.13", "brows..

생성자에서 함수를 바인딩해야 하는 이유는 무엇입니까? 이 코드와 관련된 질문이 있습니다.https://github.com/reactjs/redux/blob/master/examples/async/containers/App.js 구체적으로는 다음과 같습니다. constructor(props) { super(props) this.handleChange = this.handleChange.bind(this) this.handleRefreshClick = this.handleRefreshClick.bind(this) } 2부 질문인 것 같아요. 핸들 변경을 클래스의 인스턴스로 설정해야 하는 이유this.handleChange =, handleChange에 정적 함수를 사용하여 클래스 내에서 직접 호출할 수 없습..

리액트 라우터 4에서의 앵커태그 사용 사용자가 앵커 링크를 통해 페이지로 이동할 때 페이지가 내 앵커 태그까지 스크롤되도록 합니다. 리액트 라우터 4를 사용하고 있으며, 다음과 같이 정의했습니다. 네비게이션 바: export default (props) => { const { updateModal, updateRoute, } = props return( TESTING ANCHOR ... 일부 루트: export default class extends Component { constructor() { super() this.state = { isLoading: true } } render() { return ( Ipos morna santos paros ... navebar의 앵커링크를 클릭하면 URL과 ..

리액트 부트스트랩이 리액트 컴포넌트를 스타일링하지 않음 어제 리액트를 사용하기 시작했으니 데모 앱을 셋업해 주세요.환경: 타이프 스크립트 웹 팩 리액트 & 리액트 DOM 부트스트랩 스타일을 설정하려고 합니다. 이 튜토리얼을 따라갔지만 Typescript에 맞게 수정했습니다. https://medium.com/@senglungtw/web-pack-with-b94d33765970 모든 것이 동작하며 페이지에 signin 폼이 표시되고 React-Bootstrap에 의해 부트스트랩 HTML이 출력됩니다.단, 스타일은 요소에 적용되지 않습니다.단, Bootstrap 스타일은 적용되지 않은 단순한 HTML 페이지입니다.설정에 없는 것이 무엇인지 잘 모르겠습니다. webpack.config.syslog 튜토리얼에서..

Reactjs - 인라인 스타일 올바르게 설정 검도 스플리터와 함께 Reactjs를 사용하려고 합니다.스플리터에는 다음과 같은 스타일 속성이 있습니다. style="height: 100%" Reactjs에서는 올바르게 이해하면 인라인 스타일로 구현할 수 있습니다. var style = { height: 100 } 다만, 저는 Dustin Getz jsxutil도 조금 더 분할하여 독립된HTML fragment를 가지기 위해 사용하고 있습니다.지금까지, 다음의 html fragment(splitter.html)를 가지고 있습니다. Outer splitter : top pane (resizable and collapsible) {height} Inner splitter :: left pane Inner sp..

속성 'XYZ'가 유형 '읽기 전용 ( {ing} )); const {title, img, instructions} = this.props return ( {title} Ingredients: {ingredients} Instructions: {instructions} ) } } .props의 스크린샷 오류 그러나 이 프로젝트는 컴파일 시간 오류를 발생시키지 않으며 웹 사이트는 완벽하게 작동합니다. Chrome 콘솔 또는 터미널 오류 없이 정상적으로 작동하는 스크린샷 리액트 튜토리얼 프로젝트를 에디터에 작성했을 때(최종 인덱스를 복사해 넣기까지 했다) 비슷한 문제가 발생하기 때문에 코드와 관련이 적고, VS코드용 Javascript 또는 사전 설정 구성 중 하나에서 컴포넌트별로 .props 속성을 식별하..