(資料圖)
本教程操作環境:Windows10系統、react18.0.0版、Dell G3電腦。
react 三個點代表什么?
代表“延展操作符”。
這個 … 操作符(也被叫做延展操作符 - spread operator)已經被 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,Sherlock
而在 React 中,延展操作符一般用于屬性的批量賦值上。在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視頻教程》
以上就是react 三個點代表什么的詳細內容,更多請關注php中文網其它相關文章!
關鍵詞: React