Блог

Главная - Вопросы по программированию - Reactjs устанавливает состояние из json

Reactjs устанавливает состояние из json

#reactjs #json #react-hooks

Вопрос:

   const [items, setItems] = useState([])

 const getItems= () => {
  fetch(`${process.env.REACT_APP_API_URL}/invoice/Draft/1`, {
  method: 'GET',
  headers: {
    'Content-Type': 'application/json',
    'x-business-name' : 'billings',
    "Accept":"application/json"
  },

})
  .then(response => response.json())
  .then(items => setItems(items))
  .catch(err => console.log(err))
}

 useEffect(() => {
getItems()
}, []);

я хочу получить данные из json и привести их в такое состояние

   const [lineItems, setLineItems] = useState([
{

  name: '',
  description: '',
  quantity: 1,
  price: 0.00,
},
 ]);

когда я пытался

     console.log(items.length > 0 amp;amp; items[0].items amp;amp; items[0].items.map(item => item.name)[0])

он показал мне элемент, который я хочу получить
, это результат console.log

теперь я хочу вставить этот номер в свой штат вместо

   quantity: 1,

и, наконец, вот как выглядит мой json

  [
   {
"id": 1,
"invoiceno": "4",
"description": "facture",
"taxrate": 10,
"issuedate": "2021-07-14T23:00:00.000Z",
"duedate": "2021-07-08T23:00:00.000Z",
"note": "facture",
"taxamount": 10,
"subtotal": 100,
"total": 100,
"updatedAt": null,
"updatedBy": null,
"createdAt": "2021-07-31T16:40:43.000Z",
"createdBy": 0,
"items": [
    {
        "id": 1,
        "description": "milk",
        "item": 12,
        "quantity": 1,
        "price": 500,
        "idInvoice": 1
    },
    {
        "id": 2,
        "description": "water",
        "item": 12,
        "quantity": 1,
        "price": 500,
        "idInvoice": 1
    }
      ]
     }
       ]

я хочу, чтобы товары ( описание цены количества товара все были в моем состоянии из json)

Комментарии:

1. Я предполагаю, что вам удалось извлечь эти данные json, и теперь вам нужно отформатировать их в другой массив , содержащий только description , quantity , и price . Я не рекомендую использовать для этого другое состояние. В любом случае, вот как я прошелся по вашим образцам данных, чтобы создать короткий массив: codepen.io/moaaz_bs/pen/dyzMgVM?editors=0010

2. это не помогло с моей проблемой, потому что я должен инициализировать их в состоянии

3. const [LineItems, setLineItems] = Состояние использования([ { имя: newItems.name, описание: «, количество: 1, цена: 0.00, }, ]); я хочу что-то подобное, я пытался назвать это newItems.name все еще не работает

4. С состоянием: codesandbox.io/s/react-starter-forked-rouq8?file=/src/index.js

5. Извините, если я не понимаю вашей проблемы

Метки: