ホームページ > 記事 > ウェブフロントエンド > 3 つの点は、react で何を表していますか?
#このチュートリアルの動作環境: Windows 10 システム、React バージョン 18.0.0、Dell G3 コンピューター。React の 3 つのドットは「拡張演算子」を表します。React では、拡張演算子は通常、「var props = {};props.foo = x; props」などの属性のバッチ割り当てに使用されます。 bar = y;var コンポーネント = f403071e937cfb381b283c3650f8da72;"。
react 3 つのドットは何を表しますか?
は「拡張演算子」を表します。
... 演算子 (スプレッド演算子とも呼ばれる) は、ES6 配列ですでにサポートされています。これにより、apply を経由せずに、配列または配列に似た関数を関数のパラメーターとして直接渡すことができます。var people=['Wayou','John','Sherlock']; //sayHello函数本来接收三个单独的参数人一,人二和人三 function sayHello(people1,people2,people3){ console.log(`Hello ${people1},${people2},${people3}`); } //但是我们将一个数组以拓展参数的形式传递,它能很好地映射到每个单独的参数 sayHello(...people);//输出:Hello Wayou,John,Sherlock //而在以前,如果需要传递数组当参数,我们需要使用函数的apply方法 sayHello.apply(null,people);//输出:Hello Wayou,John,SherlockReact では、属性の一括割り当てには拡張演算子が一般的に使用されます。 JSX では、... 演算子を使用して、オブジェクトのキーと値のペアを ReactElement の props 属性とマージできます。
var props = {}; props.foo = x; props.bar = y; var component = <Component {...props} />; //等价于 var props = {}; props.foo = x; props.bar = y; var component = <Component foo={x} bar={y} />;これは、通常の XML 属性と混合することもできます。同じ名前の属性が必要で、後者は前者をオーバーライドします:
var props = { foo: 'default' }; var component = <Component {...props} foo={'override'} />; console.log(component.props.foo); // 'override'推奨される学習: "
react videoチュートリアル"
以上が3 つの点は、react で何を表していますか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。