Question

我正在尝试将一个项目添加到数组中。该数组是使用API提取的。

但是当我单击添加项目时，它没有更新。

这是我的onChange代码

2020-02-29 22:55:24.911 28271-28271/info.gryb.secdroid E/KC addKey: java.security.KeyStoreException: java.lang.NullPointerException: Attempt to invoke virtual method 'int java.lang.String.length()' on a null object reference
2020-02-29 22:55:24.912 28271-28271/info.gryb.secdroid E/KC addKey: java.security.KeyStoreException: java.lang.NullPointerException: Attempt to invoke virtual method 'int java.lang.String.length()' on a null object reference
        at com.android.org.bouncycastle.jcajce.provider.keystore.bc.BcKeyStoreSpi.engineSetKeyEntry(BcKeyStoreSpi.java:685)
        at java.security.KeyStoreSpi.engineSetEntry(KeyStoreSpi.java:544)
        at java.security.KeyStore.setEntry(KeyStore.java:1596)
        at info.gryb.secdroid.KeystoreCrypto.addKey(KeystoreCrypto.kt:206)
        at info.gryb.secdroid.KeystoreCrypto.genKey(KeystoreCrypto.kt:122)

这是我添加到数组的代码

  const changeHandler = e => {
    e.preventDefault();
    const textName = e.target.value;
    setText(textName);
  };

这是我调用该函数的地方

  const addNewHandler = e => {
    e.preventDefault();
    const addNewname = {
      id: Math.random().toString(),
      name: text
    };

    console.log(addNewname);
    const apiupdate = [...api];
    // apiupdate.concat(addNewname);
    // console.log(apiupdate);
    setApi(apiupdate.concat(addNewname));
    console.log(api);
  };

https://codesandbox.io/s/suspicious-hooks-swvn0 ...

在沙箱中使用时，请在您的本地网络问题中使用此功能

Answer 1

像这样更改代码：

const addNewHandler = e => {
    e.preventDefault();
    const addNewname = {
       id: Math.random().toString(),
       nutritionalInformation: {
         calories: 0,
         fat: 0,
         saturatedFat: 0,
         sugars: 0,
         salt: 0
      },
      name: text
    };

    console.log(addNewname);
    const apiupdate = [...api, addNewname];
    // apiupdate.concat(addNewname);
    // console.log(apiupdate);
    setApi(apiupdate);
    console.log(api);
};

[...api, addNewname]在addNewname数组的末尾添加api并创建一个新数组。

此外，我在添加新项目时设置了nutritionalInformation。

向数组添加项目-reactjs钩子

1 个答案: