React.js函数组件useState相关问题

Question

我要访问状态数据。

如何将我拥有的array object复制到data array中？

-代码

function TableList() {

  const [state, setState] = React.useState({
    columns: [
      { title: '로트번호', field: 'lote_id' },
      { title: '중량(kg)', field: 'item_weight' },
      { title: '수량', field: 'item_quantity' },
      { title: '제품코드', field: 'item_code' },
      { title: '제품명', field: 'item_name' },
      { title: '규격', field: 'standard' },
      { title: '재질', field: 'material' },
      { title: '공정명', field: 'process_name' },
      { title: '단중', field: 'unitweight' },
      { title: '납기일시', field: 'duedate' },
      { title: '단가', field: 'item_cost' },
      { title: '금액', field: 'item_price' },
    ],
    data: [],
  });


  useEffect(() =>{
    console.log("실행")
    console.log(state.data);

    axios.get('http://localhost:8080/api/item/1')
    .then( response => {
         //I want to copy the data of my output.list to state.data.
    })
    .catch( response => {
      console.log(response);
    })
  });

我想将axios响应数据复制到声明为useState的数据数组中。 请告诉我最有效的方法。

1. 如何访问第二个参数state.data？

2. 我要访问并放置我的output.list响应数据。

Answer 1

不清楚要查找什么，但是如果您只想更新状态对象上的data道具，则可以这样做：

const arrayOfObjects = [{ id: 1 }, { id: 2 }];
const newState = Object.assign({}, state);
newState.data = arrayOfObjects;
setState(newState);

Answer 2

这不是使用useState的好方法。

const [columns,setColumns] = React.useState([bla,bla]);
const [data, setData] = React.useState([bla, bla]);

您应该像上面一样分别声明状态变量。

Answer 3

  useEffect(() =>{
    console.log("실행")
    console.log(state.data);

    axios.get('http://localhost:8080/api/item/1')
    .then( response => {
      //console.log(response);
      var output = response && response.data;

      const newState = Object.assign({}, state);
      newState.data = output.list;
      setState(newState);
    })
    .catch( response => {
      console.log(response);
    })
  });

我想像已安装的函数一样调用一次