Reactjs react挂钩和道具的命名约定？

组件的道具名称和局部状态变量名称是冲突的。全球是否遵循任何命名约定？请参阅“选定”道具和状态

function Select({options,selected,onSelect}){

    let [selected,setSelect]=useState(selected)

    //... useeffect to update local state if props changes

    function setSelectLocal(){
       setSelect(e.target.value)
       onSelect(e.target.value)
    }

    return (
    <select onChange={onSelect} value={selected}>
        {options.map((option)=><option>{option}</option>)}
    </select>  
   )
}

函数选择（{options，selected，onSelect}）{
let[selected，setSelect]=使用状态（selected）
//…如果道具更改，则使用Effect更新本地状态
函数setSelectLocal（）{
设置选择（如目标值）
onSelect（如target.value）
}
返回(
{options.map（（option）=>{option}）}
)
}

---

谢谢

我想说

const[selectedValue，setSelectedValue]=useState（'default value'）

但是，更好的选择是让父组件处理状态，并通过props简单地传递处理程序

function ParentComponent() {
  const [selectedValue, setSelectedValue] = useState('default value')

  const onChange = (e) => {
    setSelectedValue(e.target.value)
  }

  return (
    <div>
      // other stuff here
      <ChildComponent options={stuff} onChange={onChange} selectedValue={selectedValue} />
    </div>
  )
}

function ChildComponent({ options, onChange, selectedValue }) {
  return (
    <select onChange={onChange} value={selectedValue}>
      {options.map((option)=><option>{option}</option>)}
    </select>  
  )
}

函数ParentComponent（）{
常量[selectedValue，setSelectedValue]=useState（“默认值”）
const onChange=（e）=>{
设置选定值（如目标值）
}
返回(
//这里还有其他东西
)
}
函数子组件（{options，onChange，selectedValue}）{
返回(
{options.map（（option）=>{option}）}
)
}

简明 我会根据值或setter的语义来命名，例如：

const[opened，open]=useState（false）

如果自然语言为状态和行为提供了一对很好的组合，那么这种方法就很有效。
这并不总是清楚的，因为它不应该是
open，open
（形容词和动词？）

退路
在文档中经常会看到类似的内容，这是一种合理的默认设置

const[progress，set_progress]=useState（{}）

因为
progress，progress
（名词、动词）将导致相同的名称。
检查参数“selected”并使用state声明。无论如何，它抛出重复声明错误。不过，如果在键入代码时可以避免使用更好的命名约定，则