Добавяне на информация за продавача в Redux

Ние с вас говорихме за това, че нашите продукти фактически се добавят в приложението от продавачи. Нека при добавяне на нов продукт да извеждаме информация за продавача.

Нека отворим нашето приложение с продукти, а в него файла productsSlice.js. Нека да предаваме в prepare още един параметър, ще го наречем sellerId и ще го установим натам за payload на екшъна. Сега нашият парче код за prepare ще бъде такъв:

products/productsSlice.jsprepare(name, desc, price, amount, sellerId) {
  return {
    payload: {
      id: nanoid(),
      name,
      desc,
      price,
      amount,
      seller: sellerId,
    },
  }
},

Сега трябва да направим редица промени във файла с формата за добавяне на продукт NewProductForm.jsx. За начало нека добавим още едно локално състояние за id на продавача:

products/NewProductForm.jsxconst [sellerId, setSellerId] = useState('')

След това след декларацията на променливата dispatch за useDispatch, нека добавим код за получаване на слайса на продавачите от състоянието с помощта на хука useSelector:

products/NewProductForm.jsxconst sellers = useSelector((state) => state.sellers)

В обработвачите за полетата за въвеждане нека добавим още един:

products/NewProductForm.jsxconst onSellerChanged = (e) => setSellerId(e.target.value)

Нека поправим onSaveProductClick, като добавим за екшъна productAdded още и sellerId:

products/NewProductForm.jsxdispatch(productAdded(name, desc, price, amount, sellerId))