首頁猿問如何將特定的 props 映射到...

如何將特定的 props 映射到 state？

JavaScript

瀟瀟雨雨 2023-11-02 22:19:10

我正在嘗試將特定的道具映射到狀態brands。另外，不要添加狀態中已存在的值brands。目標輸出：brands: [ "IKEA", "Tesla"]我的嘗試const mapState = (state) => ({ brands: state.products.forEach(product => { if (product.brands) { return product.brands; } })});export default connect(mapState)(Brands);狀態：products: [ { "id": 1, "title": "Pen", "brands": "IKEA" }, { "id": 2, "title": "Flamethrower", "brands": "Tesla" }, { "id": 3, "title": "T-shirt", "brands": "Tesla" }]

查看完整描述

3 回答

海綿寶寶撒

TA貢獻1809條經驗獲得超8個贊

.reduce您可以通過使用[1] 構建一系列不同的產品來執行以下操作。

const mapState = (state) => ({

brands: state

.products

.reduce((brands, product) => {

if (!brands.includes(product.brands)) {

return brands.concat([product.brands]);

}

return brands;

}, [])

})

});

export default connect(mapState)(Brands);

如果您需要在應用程序中重用此函數，則可以將檢索不同品牌的功能提取到函數中：

function getProductBrands(products) {

return products

.reduce((brands, product) => {

if (!brands.includes(product.brands)) {

return brands.concat([product.brands]);

}

return brands;

}, []);

}

參考文獻：[1] https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/reduce

反對回復 2023-11-02

翻翻過去那場雪

TA貢獻2065條經驗獲得超14個贊

forEach不返回任何內容。您可以做的是創建一個函數getAllProductBrands并調用該函數。然后，此函數應返回所有品牌的列表。

const getAllProductBrands = (products) => {

const brands = [];

products.forEach(product => {

if(!brands.some(brand => brand === product.brand) {

brands = [...brands, product.brand];

};

});

};

然后你可以在你的mapState中調用這個函數。

const mapState = (state) => ({

brands: getAllProductBrands(state.products)

});

反對回復 2023-11-02

牛魔王的故事

TA貢獻1830條經驗獲得超3個贊

獲取唯一的品牌列表

const mapState = ({products}) => {

const brands = [...new Set( products

.map(product => product.brands))];

return { brands }

};

反對回復 2023-11-02

3 回答
0 關注
204 瀏覽

關注

添加回答

舉報

0/150

提交

取消

亚洲在线久爱草,狠狠天天香蕉网,天天搞日日干久草,伊人亚洲日本欧美

熱搜

最近搜索清空

如何將特定的 props 映射到 state？

如何將特定的 props 映射到 state？

3 回答

添加回答

如何將特定的 props 映射到 state？