使用 React.js 中的 URI 更改按钮值

Question

我制作了几个按钮，可以将其值更改为 select 或 deselect。但我想使用从 API fetch.

获得的 URI

这是我的代码：

const ButtonComponent = () => {
  const [isSelected, setIsSelected] = useState(false)

  return (
    <div className="button">
          <button onClick={() => setIsSelected(!isSelected)}>{isSelected ? "Deselect" : "Select"}</button>
          <button onClick={() => setIsSelected(!isSelected)}>{isSelected ? "Deselect" : "Select"}</button>
          <button onClick={() => setIsSelected(!isSelected)}>{isSelected ? "Deselect" : "Select"}</button>
    </div>
  )
}

我必须将 URI 放在哪里才能将其保存在状态中？

注意：URI 状态可以是数组

Answer 1

我不完全确定这是否是您要找的，但如果可以，请告诉我。


    const ButtonComponent = () => {
      const [isSelected, setIsSelected] = useState(false)
      const [uri, setUri] = useState(null)
    
      return (
        <div className="button">
              <button 
                onClick={() => {
                  setIsSelected(!isSelected)
                  setUrl('uri1')
                }}>
                {isSelected ? "Deselect" : "Select"}
              </button>
              <button 
                onClick={() => {
                  setIsSelected(!isSelected)
                  setUrl('uri2')
                }}>
                {isSelected ? "Deselect" : "Select"}
              </button>
              <button 
                onClick={() => {
                  setIsSelected(!isSelected)
                  setUrl('uri3')
                }}>
                {isSelected ? "Deselect" : "Select"}
              </button>
        </div>
      )
    }

你想要这样的东西吗？

使用 React.js 中的 URI 更改按钮值

Change button value using URI in React.js

reactjs

api

react-hooks

uri

react-state