Câu hỏi được gắn thẻ «jsx»

Cho một thành phần đơn giản làm cho con của nó: class ContainerComponent extends Component { static propTypes = { children: PropTypes.object.isRequired, } render() { return ( <div> {this.props.children} </div> ); } } export default ContainerComponent; Câu hỏi: propType của trẻ em nên là gì? Khi tôi đặt nó làm …

265 reactjs  jsx  react-proptypes 

Có một cái gì đó tôi thấy rất khó hiểu khi làm việc React. Có rất nhiều ví dụ có sẵn trên internet sử dụng .jscác tệp có phản ứng nhưng nhiều ví dụ khác sử dụng .jsxcác tệp. Tôi đã đọc về .jsxcác tập tin và sự hiểu biết …

211 reactjs  jsx 

Trong các tài liệu chính thức của React, nó đề cập đến - Nếu bạn đã quen thuộc với các phương thức vòng đời của lớp React, bạn có thể nghĩ đến việc sử dụngEffect Hook như thành phầnDidMount, thành phầnDidUpdate và thành phầnWillUnmount kết hợp. Câu hỏi của tôi …

174 javascript  reactjs  jsx  react-hooks 

Tôi cố gắng viết một thành phần React. đối với các thẻ tiêu đề html (h1, h2, h3, v.v ...), trong đó mức độ ưu tiên của tiêu đề thay đổi linh hoạt dựa trên mức độ ưu tiên mà chúng ta đã xác định trong các đạo cụ. Đây …

162 reactjs  jsx 

Đây là những gì tôi đã cố gắng và làm thế nào nó đi sai. Những công việc này: <div dangerouslySetInnerHTML={{ __html: "<h1>Hi there!</h1>" }} /> Đây không phải là: <div dangerouslySetInnerHTML={{ __html: this.props.match.description }} /> Thuộc tính mô tả chỉ là một chuỗi nội dung HTML bình thường. Tuy …

159 javascript  html  reactjs  jsx 

Tò mò cách đúng đắn để tiếp cận điều này là: var Hello = React.createClass({ getInitialState: function() { return {total: 0, input1:0, input2:0}; }, render: function() { return ( <div>{this.state.total}<br/> <input type="text" value={this.state.input1} onChange={this.handleChange} /> <input type="text" value={this.state.input2} onChange={this.handleChange} /> </div> ); }, handleChange: function(e){ this.setState({ ??? : e.target.value}); t …

141 javascript  reactjs  jsx 

Tôi có một thành phần chức năng rất đơn giản như sau: import * as React from 'react'; export interface AuxProps { children: React.ReactNode } const aux = (props: AuxProps) => props.children; export default aux; Và một thành phần khác: import * as React from "react"; export interface LayoutProps { …

137 reactjs  typescript  jsx  typescript2.0 

Tôi đang chạy lint với ứng dụng React của mình và tôi nhận được lỗi này: error JSX props should not use arrow functions react/jsx-no-bind Và đây là nơi tôi đang chạy hàm mũi tên (bên trong onClick): {this.state.photos.map(tile => ( <span key={tile.img}> <Checkbox defaultChecked={tile.checked} onCheck={() => this.selectPicture(tile)} style={{position: 'absolute', …

103 javascript  reactjs  ecmascript-6  jsx  arrow-functions 

Tôi đang sử dụng thẻ & nbsp trong jsx và nó không hiển thị không gian. Sau đây là một đoạn mã nhỏ của tôi. Vui lòng giúp đỡ. var Reporting=React.createClass({ render: function(){ return( <div style={divPositionReporting}> <p>Pricing Reports</p> <hr></hr> Select Scenario:   <select> <option></option> </select> <button type="button">Get Pricing Report</button> <br/> Select …

99 html  reactjs  jsx 

Tôi có một phần tử TSX (JSX) hộp kiểm: <input type="checkbox" name={i.toString()} onClick={this.handleCheckboxClick} /> Với sự trợ giúp của mã VS, tôi biết rằng loại tham số đầu vào của this.handleCheckboxClicklà MouseEvent<HTMLInputElement>. Vì vậy, tôi đã triển khai nó với: private handleCheckboxClick(event: MouseEvent<HTMLInputElement>) { ... } Sau đó, tôi gặp …

92 reactjs  typescript  events  types  jsx 

Tôi đang làm việc trên một dự án với Typescript, React và Redux (tất cả đều chạy trong Electron) và tôi đã gặp sự cố khi đưa một thành phần dựa trên lớp vào một thành phần khác và cố gắng chuyển các tham số giữa chúng. Nói một cách …

91 reactjs  typescript  redux  electron  jsx 

Tôi đã thiết lập eslint& eslint-plugin-react. Khi tôi chạy ESLint, linter trả về no-unused-varslỗi cho từng thành phần React. Tôi cho rằng nó không nhận ra rằng tôi đang sử dụng cú pháp JSX hoặc React. Có ý kiến ​​gì không? Thí dụ: app.js import React, { Component } from …

86 javascript  reactjs  jsx  eslint 

Tôi hiện đang xây dựng một ứng dụng thử nghiệm bằng React Native. Mô-đun Hình ảnh, cho đến nay vẫn hoạt động tốt. Ví dụ: nếu tôi có một hình ảnh được đặt tên avatar, đoạn mã dưới đây hoạt động tốt. <Image source={require('image!avatar')} /> Nhưng nếu tôi thay đổi …

84 javascript  react-native  jsx 

Tôi đang cố thiết lập bộ định tuyến phản ứng trong một ứng dụng mẫu và gặp lỗi sau: You should not use <Link> outside a <Router> Ứng dụng của tôi được thiết lập như vậy: Thành phần chính const router = ( <div className="sans-serif"> <Router histpry={browserHistory}> <Route path="/" component={Main}> …

80 reactjs  react-router  jsx 

Tôi đang tìm cách tạo một thành phần không trạng thái input phần tử của thành phần mẹ có thể được xác thực bởi thành phần mẹ. Trong ví dụ của tôi bên dưới, tôi đang gặp sự cố trong đó đầu vào refkhông bao giờ được gán cho quyền …

79 reactjs  typescript  jsx