score:11
here the issue is not with state selection, the actual issue is that the label is not getting displayed.
so, as per your addisyoungervalue
function you are setting the value of this.state.currentobject.isyounger
to whole object. i.e. { value: true, label: "younger" }
. so, the issue can be solved by changing the value of initial state by below.
this.state = {
array: [],
currentobject: {
isyounger: { value: true, label: "younger" }
}
};
and hurrey, the default value label will be shown..
score:5
there is an alternate way to use value as your defaultvalue. in my case i have used "id" and "industry" instead of "label" and "value"
this.state = {
interested_industries: [{id:"any", industry:"any"}]
}
and in select component:-
<select
name="interested_industries"
options={industries}
value={interested_industries}
getoptionlabel={ x => x.id}
getoptionvalue={ x => x.industry}
onchange={this.handleselect}
ismulti
/>
score:6
your defaultvalue
or value
must be objects. in your case like this:
defaultvalue={isyoungeroptions[0]}
or
this.state = {
array: [],
currentobject: {
isyounger: { value: "true", label: "younger" }
}
};
here an live example.
Source: stackoverflow.com
Related Query
- Setting a default value with react-select not working
- React select box default value sometimes not working
- why is react select default value not working
- React - setting input value with JavaScript does not trigger 'onChange'
- Setting a default value on a react select dropdown that is populated from an API call
- React | Ant design select value not setting
- react select not recognizing default value
- show default value in select input with backgroundcoulr different for each : react js
- React set value to select not working but use selected in option is fine
- Default value with react-select, checkboxes not working when I want to post my data having a blank page output
- MenuItem with dynamic value is not working in Material UI React
- React HOC callback not working with default props
- React Custom Multi Select Not working with external array
- Toggling value inside React component with useState not working
- Working with react input field says synthetic even when i try and save, and setting value instead of defaultValue is rendering [Object, object]
- react hooks not setting the select value after fetching options
- React hooks with multiple state values not working but separate state value works
- Setting state with dictionnary not working in REACT
- Default value is not selected with react-select (4.3.1) using React Hooks
- React | Ant Design - Default value in Select component with Search with remote data
- Filter not working on Object with null Value in React
- react useState not working with new Date() as initial value
- Function default value not working normally in react native
- React DatePicker loads with default value but then will not change when state changes
- antd 4: setting a default value for Select with defaultValue, can't use initialValue
- React select is not updating for default value
- Setting GraphQL variable dynamically with React Hook is not working
- My form is not updating when its. preloaded with default value - react
- React router default route not working with nested structure
- React - useState not setting initial value
More Query from same tag
- How to select all objects in nested hierarchy by property in react application?
- Dynamically generate <tr> through a function in React
- Change value of object property with checkbox React
- How to add custom indicator in trading view Charting library in reactjs
- How can I get a child element value when rendering in React?
- Conditional jsx on react Js
- Hover background change based on theme selected
- Cannot read property 'getState' of undefined - Redux
- React . How to save into a variable ,and not in console.log()
- React - Test if an element has 'disabled' set
- Can't seem to pass prop from component to component. (React/Redux)
- React Dynamic Child Component Numbering
- how to make multiline chart with dashed line segment in each line in d3
- Change state of something from another class with a button
- get selected file object with react-hook-form
- How to type a input ref for file upload
- How can I loop through to make a list with a Link?
- React prop types with TypeScript - how to have a function type?
- TypeScript React Hooks Upgrade Path
- react export Unexpected token
- i18n.exists is not a function while testing via jest / react-testing library
- NextJS Property 'Component' does not exist on type 'App<{}, {}, {}>'
- How do I make sidebar automatically disappear once a menu item clicked
- I am creating a table with a detaled row using React-Table and its hock useExpanded, but it doesn't working
- Dollar symbol ($) in React/ES2015
- Errors when mocking firebase within a React app using Jest and React Testing Library
- How to use react to listen a loop events with contract?
- React add images to existing map
- Pass props to a child component on page load - react with next.js
- Using immutability-helper with Array, Object, Map