Javascript 反应选择默认值已设置,但未显示
我甚至尝试过像文档中那样手动设置默认值,但没有骰子。我不确定这是造型问题还是什么。所以在下面我发布了我所拥有的以及一个截图Javascript 反应选择默认值已设置,但未显示,javascript,reactjs,redux,react-select,Javascript,Reactjs,Redux,React Select,我甚至尝试过像文档中那样手动设置默认值,但没有骰子。我不确定这是造型问题还是什么。所以在下面我发布了我所拥有的以及一个截图 <Select components={animatedComponents} getOptionLabel={convertToLabel} getOptionValue={option => option.resource_name} isMulti onChange={ch
<Select
components={animatedComponents}
getOptionLabel={convertToLabel}
getOptionValue={option => option.resource_name}
isMulti
onChange={changeEvent}
options={users}
theme={theme => ({
...theme,
borderRadius: 0
})}
defaultValue={(props.value || []).map(convertToValue)}
value={(props.value || []).map(convertToValue)}
/>
转换标签函数
const convertToLabel = props => {
return `${props.name} ${props.family_name}`;
};
changeEvent函数
用户和道具对象
users:
[
{
resource_name: "facebook_user1",
name: "Joe",
family_name: "Dirt"
},
{
resource_name: "facebook_user2",
name: "Trident",
family_name: "White"
}
]
props:
{
field: "placeholder",
fieldType: "placeholderType"
value:[
{
resource_name: "facebook_user1",
name: "Joe",
family_name: "Dirt"
},
{
resource_name: "facebook_user2",
name: "Trident",
family_name: "White"
}
]
}
我在屏幕上看到的
如果看不到select渲染的实际JSX,就很难准确地说出问题所在。下面是我看到的一些问题,看看你的问题,以及一些关于可能发生的事情的猜测 您应该向我们展示Select实现的完整JSX呈现 您从未向我们展示您的defaultValue道具的外观,但是 请记住,该值应等于 选项,而不仅仅是选项“值” 您的标签和选项getter 方法签名应该是getOptionLabel=option=>string和 getOptionValue=option=>string。你用过道具,这 在您的实例中,可能与父范围冲突。 你可能想要 您的convertToValue方法签名也要与这些方法一致。 您的onChange事件方法签名与 做出选择,可能会给你带来痛苦。请参阅我的帮助。
如果看不到更多的代码,很难说Select是如何定义的?value prop是否正确地传递给呈现Select组件的对象?但我想知道它是否与定义值和defaultValue有关。通常为受控组件定义一个值,其中默认值为等于的任何值。defaultValue通常用于不受控制的组件,您不会提供值@hellojeffhall是从react select库定义的。哦,是的,如果我设置的默认值是正确的,我会测试这两个。好的,所以我试着按照react select文档中的说明定义defaultValue,结果仍然是一样的:/you cannel.logprops.value,这样我们就可以看到传递到?props{field:placeholder,fieldType:placeholder-type,value:{{resource_name:facebook_user1,name:Joe,family_name:Dirt},{resource_name:facebook_user2,name:Trident,family_name:White}}}@hellojeffhall,评论的格式很奇怪。请查看上面主帖子中编辑的道具
const changeEvent = (selectedOption, i) => {
let option = {
name: "reviewers",
value: selectedOption
};
update({ target: option });
};
users:
[
{
resource_name: "facebook_user1",
name: "Joe",
family_name: "Dirt"
},
{
resource_name: "facebook_user2",
name: "Trident",
family_name: "White"
}
]
props:
{
field: "placeholder",
fieldType: "placeholderType"
value:[
{
resource_name: "facebook_user1",
name: "Joe",
family_name: "Dirt"
},
{
resource_name: "facebook_user2",
name: "Trident",
family_name: "White"
}
]
}