Pertanyaan yang diberi tag «react-jsx»

Saya mencoba menemukan cara yang tepat untuk mendefinisikan beberapa komponen yang dapat digunakan secara umum: <Parent> <Child value="1"> <Child value="2"> </Parent> Ada logika yang terjadi untuk rendering antara komponen orang tua dan anak-anak, Anda bisa bayangkan <select>dan<option> sebagai contoh dari logika ini. Ini adalah implementasi tiruan untuk tujuan pertanyaan: var …

889 javascript  reactjs  react-jsx 

Saya memiliki objek eksternal (ke komponen) yang dapat diamati yang ingin saya dengarkan untuk perubahan. Ketika objek diperbarui itu memancarkan perubahan peristiwa, dan kemudian saya ingin rerender komponen ketika ada perubahan yang terdeteksi. Dengan top-level React.renderhal ini dimungkinkan, tetapi di dalam komponen itu tidak berfungsi (yang masuk akal karena rendermetode …

688 reactjs  react-jsx 

Saya sadar bahwa Anda dapat menentukan gaya dalam kelas Bereaksi, seperti ini: var MyDiv = React.createClass({ render: function() { var style = { color: 'white', fontSize: 200 }; return <div style={style}> Have a good and productive day! </div>; } }); Haruskah saya bertujuan melakukan semua gaya dengan cara ini, dan …

512 css  reactjs  inline-styles  react-jsx 

Saya membaca bagian FormulirReaksidokumentasi dan baru saja mencoba kode ini untuk menunjukkan onChangepenggunaan ( JSBIN ). var React= require('react'); var ControlledForm= React.createClass({ getInitialState: function() { return { value: "initial value" }; }, handleChange: function(event) { console.log(this.state.value); this.setState({value: event.target.value}); console.log(this.state.value); }, render: function() { return ( <input type="text" value={this.state.value} onChange={this.handleChange}/> ); …

326 javascript  reactjs  react-jsx 

Saya memiliki masalah yang relatif mudah mencoba menambahkan skrip sebaris ke komponen Bereaksi. Apa yang saya miliki sejauh ini: 'use strict'; import '../../styles/pages/people.scss'; import React, { Component } from 'react'; import DocumentTitle from 'react-document-title'; import { prefix } from '../../core/util'; export default class extends Component { render() { return ( …

266 javascript  reactjs  ecmascript-6  react-jsx 

Bagaimana saya secara opsional memasukkan elemen dalam JSX? Berikut ini adalah contoh menggunakan spanduk yang seharusnya ada di komponen jika sudah disahkan. Yang ingin saya hindari adalah harus menduplikasi tag HTML dalam pernyataan if. render: function () { var banner; if (this.state.banner) { banner = <div id="banner">{this.state.banner}</div>; } else { …

229 javascript  reactjs  react-jsx 

Saya sedang membangun sesuatu dengan React di mana saya harus memasukkan HTML dengan React Variables di JSX. Apakah ada cara untuk memiliki variabel seperti: var thisIsMyCopy = '<p>copy copy copy <strong>strong copy</strong></p>'; dan memasukkannya ke dalam reaksi seperti itu, dan membuatnya bekerja? render: function() { return ( <div className="content">{thisIsMyCopy}</div> ); …

203 javascript  html  frontend  reactjs  react-jsx 

Saya mencoba membuat komponen secara dinamis berdasarkan jenisnya. Sebagai contoh: var type = "Example"; var ComponentName = type + "Component"; return <ComponentName />; // Returns <examplecomponent /> instead of <ExampleComponent /> Saya mencoba solusi yang diusulkan di sini Bereaksi / JSX nama komponen dinamis Itu memberi saya kesalahan saat kompilasi …

168 javascript  reactjs  react-jsx 

Saya mencoba untuk mengkonversi komponen jQuery ke React.js dan salah satu hal yang saya mengalami kesulitan dengan rendering n sejumlah elemen berdasarkan for for loop. Saya mengerti ini tidak mungkin, atau direkomendasikan dan bahwa di mana ada array dalam model itu masuk akal untuk digunakan map. Tidak apa-apa, tetapi bagaimana …

146 javascript  jquery  reactjs  react-jsx 

Saya baru saja mulai menjelajahi React, dengan menambahkan komponen dengan fungsi render sederhana: render() { return <div class="myApp"></div> } Ketika saya menjalankan aplikasi, saya mendapatkan kesalahan berikut: Warning: Unknown DOM property class. Did you mean className? Saya bisa mengatasi ini dengan mengubah classke className. Pertanyaannya adalah; apakah React memberlakukan konvensi …

114 javascript  reactjs  react-jsx 

Saya mencoba untuk mulai membangun situs di ReactJS. Namun, ketika saya mencoba untuk meletakkan JS saya di file terpisah, saya mulai mendapatkan kesalahan ini: "SyntaxError Tidak Tertangkap: Token tidak terduga <". Saya mencoba menambahkan /** @jsx React.DOM */ke bagian atas file JS, tetapi tidak memperbaiki apa pun. Di bawah ini …

110 javascript  html  reactjs  react-jsx 

Saya memiliki file test_stuff.js yang saya jalankan npm test Ini terlihat seperti ini: import { assert } from 'assert'; import { MyProvider } from '../src/index'; import { React } from 'react'; const myProvider = ( <MyProvider> </MyProvider> ); describe('Array', function() { describe('#indexOf()', function() { it('should return -1 when the value …

102 javascript  reactjs  npm  react-jsx 

Saya menggunakan Sublime Text sebagai editor teks. Ada jsFormat untuk memformat file javascript tetapi saya tidak dapat menemukannya untuk JSX. Bagaimana kalian menangani pemformatan JSX?

91 reactjs  sublimetext  react-jsx 

Saya mengerti bagaimana (dan mengapa ) menambahkan whitespace di JSX, tapi saya bertanya-tanya apa praktik terbaik atau apakah ada yang membuat perbedaan nyata? Bungkus kedua elemen dalam satu bentang <div className="top-element-formatting"> <span>Hello </span> <span className="second-word-formatting">World!</span> </div> Tambahkan mereka dalam satu baris <div className="top-element-formatting"> Hello <span className="second-word-formatting">World!</span> </div> Tambahkan spasi dengan …

91 javascript  reactjs  react-jsx