时间戳

首页 > 解决方案 > 将项目相互连接

javascript - 将项目相互连接

问题描述

我得到了一长串“连接的项目”（这是连接到当前项目的其他项目）。现在我想编辑并添加到这个数组中。

我可能过于复杂了，但你明白为什么我不能用setItemToAddId(e.currentTarget.value) 或直接设置currentItem 的 id （要添加）// setItemToAddId(option.identifiers.id)吗？

          {connectedItems.map((connectedItem, index) => (
            <div key={index} className="field">
              <select>
                {optionsItemToAdd.map((option) => (
                  <option
                    value={option.identifiers.id}
                    key={option.identifiers.id}
                    onChange={(e) => {
                      // eslint-disable-next-line @typescript-eslint/no-non-null-assertion
                      setItemToAddId(e.currentTarget.value)
                      // setItemToAddId(option.identifiers.id)
                      // onChangeConnectedItem(index, {
                      //   itemId: itemToAddId,
                      //   purpose: purpose,
                      //   linkInternal: `/items/${itemToAdd!.identifiers.id}`,
                      // });
                    }}
                  >
                    {option.identifiers.title}
                  </option>
                ))}
              </select>

标签： javascriptreactjstypescriptselect

解决方案

更改时应使用选择元素，而不是选项，

<select
  onChange={(e) => {
    // eslint-disable-next-line @typescript-eslint/no-non-null-assertion
    setItemToAddId(e.currentTarget.value);
    // setItemToAddId(option.identifiers.id)
    // onChangeConnectedItem(index, {
    //   itemId: itemToAddId,
    //   purpose: purpose,
    //   linkInternal: `/items/${itemToAdd!.identifiers.id}`,
    // });
  }}
>
  {optionsItemToAdd.map((option) => (
    <option value={option.identifiers.id} key={option.identifiers.id}>
      {option.identifiers.title}
    </option>
  ))}
    </select>

推荐阅读