«react-jsx» etiketlenmiş sorular

Genel bir şekilde kullanılabilecek bazı bileşenleri tanımlamak için uygun bir yol bulmaya çalışıyorum: <Parent> <Child value="1"> <Child value="2"> </Parent> Tabii ki ebeveyn ve çocuk bileşenleri arasında renderleme için bir mantık var, hayal edebilirsiniz <select>ve <option>bu mantığın bir örneği. Bu, sorunun amacı için kukla bir uygulamadır: var Parent = React.createClass({ doSomething: …

888 javascript  reactjs  react-jsx 

Değişiklikleri dinlemek istediğim harici (bileşene), gözlemlenebilir bir nesnem var. Nesne güncellendiğinde değişiklik olayları yayar ve herhangi bir değişiklik algılandığında bileşeni yeniden göndermek istiyorum. Bir üst seviye ile React.renderbu mümkün olmuştur, ancak bir bileşen içinde işe yaramaz ( renderyöntem sadece bir nesne döndürdüğü için mantıklıdır ). İşte bir kod örneği: export …

690 reactjs  react-jsx 

React sınıflarında aşağıdaki gibi stiller belirtebileceğinizin farkındayım: var MyDiv = React.createClass({ render: function() { var style = { color: 'white', fontSize: 200 }; return <div style={style}> Have a good and productive day! </div>; } }); Tüm stilleri bu şekilde yapmayı hedeflemeli miyim ve CSS dosyamda hiç stil belirtilmemiş mi? Yoksa …

512 css  reactjs  inline-styles  react-jsx 

Formlar bölümünü okuyorumreactjsve sadece onChangekullanımı göstermek için bu kodu denedim ( 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}/> ); } }); React.render( …

326 javascript  reactjs  react-jsx 

Bir React bileşenine satır içi komut dosyası eklemeye çalışırken nispeten basit bir sorun var. Şimdiye kadar ne var: '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 ( <DocumentTitle …

266 javascript  reactjs  ecmascript-6  react-jsx 

İsteğe bağlı olarak bir öğeyi JSX'e nasıl ekleyebilirim? Burada geçirilmiş olması durumunda bileşen içinde olması gereken bir başlık kullanarak bir örnek. Kaçınmak istediğim if ifadesinde HTML etiketleri çoğaltmak zorunda. render: function () { var banner; if (this.state.banner) { banner = <div id="banner">{this.state.banner}</div>; } else { banner = ????? } return …

229 javascript  reactjs  react-jsx 

Ben React ile bir şey inşa ediyorum ben JSX React Değişkenleri ile HTML eklemek gerekir. Böyle bir değişkene sahip olmanın bir yolu var mı: var thisIsMyCopy = '<p>copy copy copy <strong>strong copy</strong></p>'; ve bu şekilde reaksiyona sokmak ve işe yaramasını sağlamak mı? render: function() { return ( <div className="content">{thisIsMyCopy}</div> ); …

206 javascript  html  frontend  reactjs  react-jsx 

Dinamik olarak türlerine göre bileşenleri işlemeye çalışıyorum. Örneğin: var type = "Example"; var ComponentName = type + "Component"; return <ComponentName />; // Returns <examplecomponent /> instead of <ExampleComponent /> Burada önerilen çözümü denedim React / JSX dinamik bileşen adları Bu derlerken bana bir hata verdi (yudum için browserify kullanarak). Bir …

168 javascript  reactjs  react-jsx 

Bir jQuery bileşenini React.js'ye dönüştürmeye çalışıyorum ve zorluk yaşadığım şeylerden biri, for döngüsüne dayalı n sayıda öğeyi oluşturmaktır. Bunun mümkün olmadığını veya tavsiye edilmediğini ve modelde bir dizi bulunduğunda kullanılmasının tamamen mantıklı olduğunu anlıyorum map. Sorun değil, ama bir diziniz olmadığında ne olacak? Bunun yerine, işlenecek belirli sayıda öğeye eşit …

147 javascript  jquery  reactjs  react-jsx 

Basit bir oluşturma işlevine sahip bir bileşen ekleyerek React'i keşfetmeye yeni başladım: render() { return <div class="myApp"></div> } Uygulamayı çalıştırdığımda şu hatayı alıyorum: Warning: Unknown DOM property class. Did you mean className? Ben değiştirerek bunu çözebilir classiçin className. Soru; React bu sözleşmeyi uyguluyor mu? Ayrıca neden classNamegeleneksel yerine kullanmam gerekiyor …

114 javascript  reactjs  react-jsx 

ReactJS'de bir site oluşturmaya başlamaya çalışıyorum. Ancak, JS'mi ayrı bir dosyaya koymaya çalıştığımda, şu hatayı almaya başladım: "Yakalanmamış SyntaxError: Beklenmeyen simge <". /** @jsx React.DOM */JS dosyasının üstüne eklemeyi denedim , ancak hiçbir şeyi düzeltmedi. Aşağıda HTML ve JS dosyaları bulunmaktadır. Neyin yanlış gittiğine dair bir fikriniz var mı? HTML …

110 javascript  html  reactjs  react-jsx 

Çalıştırdığım bir test_stuff.js dosyam var npm test Hemen hemen şuna benziyor: 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 is not …

107 javascript  reactjs  npm  react-jsx 

Sublime Text'i metin düzenleyici olarak kullanıyorum. Javascript dosyalarını biçimlendirmek için bir jsFormat var, ancak JSX için bir tane bulamıyorum. JSX biçimlendirmeyle nasıl başa çıkıyorsunuz?

91 reactjs  sublimetext  react-jsx 

JSX'e nasıl (ve neden ) boşluk ekleyeceğimi anlıyorum, ancak en iyi uygulamanın ne olduğunu veya herhangi birinin gerçek bir fark yaratıp yaratmadığını merak ediyorum. Her iki öğeyi bir aralıkta sarın <div className="top-element-formatting"> <span>Hello </span> <span className="second-word-formatting">World!</span> </div> Onları tek satıra ekleyin <div className="top-element-formatting"> Hello <span className="second-word-formatting">World!</span> </div> JS ile alan …

91 javascript  reactjs  react-jsx 

Baskıdaki etkin tepki önyükleme açılır penceresini kapatmak için bağlanmak istiyorum.İşte escapekod _handleEscKey:function(event){ console.log(event); if(event.keyCode == 27){ this.state.activePopover.hide(); } }, componentWillMount:function(){ BannerDataStore.addChangeListener(this._onchange); document.addEventListener("click", this._handleDocumentClick, false); document.addEventListener("keyPress", this._handleEscKey, false); }, componentWillUnmount: function() { BannerDataStore.removeChangeListener(this._onchange); document.removeEventListener("click", this._handleDocumentClick, false); document.removeEventListener("keyPress", this._handleEscKey, false); }, Ancak herhangi bir tuşa bastığımda konsolda hiçbir şey oturum açmıyor. Bunu …

86 reactjs  react-jsx  react-bootstrap