React'te değişkenleri ve dizeleri birleştirme

Question 1

React'in küme ayracı gösterimini ve bir hrefetiketi birleştirmenin bir yolu var mı ? Eyalette aşağıdaki değere sahip olduğumuzu varsayalım:

{this.state.id}

ve bir etiket üzerinde aşağıdaki HTML nitelikleri:

href="#demo1"
id="demo1"

Bunun idgibi bir şey elde etmek için durumu HTML özelliğine eklememin bir yolu var mı :

href={"#demo + {this.state.id}"}

Hangisi verecek:

#demo1

Question 2

Neredeyse haklısın, birkaç alıntıyı yanlış yerleştirmişsin. Her şeyi normal tırnak içine almak tam anlamıyla size dizeyi verecektir #demo + {this.state.id}- hangilerinin değişken ve hangilerinin dize değişmezleri olduğunu belirtmeniz gerekir. İçindeki {}her şey bir satır içi JSX ifadesi olduğundan , şunları yapabilirsiniz:

href={"#demo" + this.state.id}

Bu, dizeyi kullanacak #demove onu değeriyle birleştirecektir this.state.id. Bu daha sonra tüm dizelere uygulanabilir. Bunu düşün:

var text = "world";

Ve bu:

{"Hello " + text + " Andrew"}

Bu şunları verecektir:

Hello world Andrew

ES6 dize enterpolasyonu / şablon değişmezlerini , ${expr}yapmaya çalıştığınız şeye daha yakın olan `(geri işaretler) ve (enterpolasyonlu ifade) ile de kullanabilirsiniz:

href={`#demo${this.state.id}`}

Bu, temelde this.state.id, onu birleştirerek değerini ikame edecektir #demo. Bu yapmakla eşdeğerdir: "#demo" + this.state.id.

Question 3

props / değişkenleri birleştirmenin en iyi yolu:

var sample = "test";    
var result = `this is just a ${sample}`;    
//this is just a test

Question 4

exampleData =

        const json1 = [
            {id: 1, test: 1},
            {id: 2, test: 2},
            {id: 3, test: 3},
            {id: 4, test: 4},
            {id: 5, test: 5}
        ];

        const json2 = [
            {id: 3, test: 6},
            {id: 4, test: 7},
            {id: 5, test: 8},
            {id: 6, test: 9},
            {id: 7, test: 10}
        ];

örnek1 =


        const finalData1 = json1.concat(json2).reduce(function (index, obj) {
            index[obj.id] = Object.assign({}, obj, index[obj.id]);
            return index;
        }, []).filter(function (res, obj) {
            return obj;
        });

örnek2 =

        let hashData = new Map();

        json1.concat(json2).forEach(function (obj) {
            hashData.set(obj.id, Object.assign(hashData.get(obj.id) || {}, obj))
        });

        const finalData2 = Array.from(hashData.values());

İkinci örneği öneririm, daha hızlıdır.

Question 5

bunu basitçe yapabilirsiniz ..

 <img src={"http://img.example.com/test/" + this.props.url +"/1.jpg"}/>