score:1
there is a workaround to force it to convert to a boolean, something like this:
<select
{...register("isactive", {
setvalueas: (v) => boolean(v)
})}
>
<option value={true}>active</option> //boolean("any string") gives true
<option value={""}>inactive</option> //boolean("") gives false
</select>
setvalueas
returns the input value by running it through a function, and since the input produce string at submitting, the only way to force it to make it boolean
is by passing an empty string.
score:0
for some reason i can't comment, big brain stackoverflow, ok however.
erm, since you're storing as a string, i recommend attaching the value to a string, then have a useeffect run with the state as a dependency setting your own personal state that is a boolean. for example
useeffect(() => {setmystate(value === "isactive" ? true : false)}, [value])
i'm having a bit too big of a brain fart, ima just imitate it.
const component = () => {
// your component, let's say you have these two states
const [linkedstate, setlinkedstate] = usestate("")
const [booleanstate, setbooleanstate] = usestate("")
// this state is linked to the string value, you then make a
useeffect with the state as dependency
useeffect(() => {
// this happens when linkedstate changes
setbooleanstate(linkedstate === "isactive" ? true : false)
// if linkedstate equals isactive it sets your boolean to true, else it goes false
}, [linkedstate])
}
Source: stackoverflow.com
Related Query
- How to store a boolean value in React after moving onto the next page?
- How to store value as a boolean in a select?
- How to select boolean value with Cypress select method without type error?
- How to set default value in material-UI select box in react?
- How to get select element's value in react-bootstrap?
- How to receive select value in handlesubmit function with formik react js?
- How to pass an object value in a form's select field onChange (using React, without Redux)
- How can I interpolate a Animated value to result into a boolean or a string in react-native?
- How to use react ref to get value from html select element?
- How do I retrieve select option data-attribute value in ReactJS?
- how to set default value in select using react js
- How to use the updated value in redux store immediately after the action is dispatched in react js functional components
- How do I set a default value for a select menu in my React form component?
- How to give default value and placeholder to redux form select field?
- MUI Select | Change how the selected value display in Input
- How the get refs antd componement Select value of antd?
- How to take input value from submit form and store in redux store variable?
- How do we check the boolean value in useEffect in react hooks?
- React - how to populate one select menu based on a value of another select menu using data from a local .json file
- How to get and output a value from the select tag
- How to automatically add a filter depending on Boolean value in JSON file
- How to store HTML as a value of an object property in react state?
- Ant Design How to display "3 Selected" in Tree Select rather than display all value selected
- React: How to map select option value to a state key?
- How to store state values as key value pair in redux..?
- How to fetch onChange from select value only when select ? is it possible without using useEfect?
- How to update Select Options value dynamically using ant design frame work
- How can I type html select element so event.target.value refers to the option value type?
- How to assign value to dictionary constant and store in state?
- How to reset value of select box to default in react
More Query from same tag
- React - conditional output using ternary operator based on variable
- props.mutators is deprecated
- ReactJS: Render some components only on demand
- Cannot make POST request with JSON from react/axios to restify server
- Programmatically submit form set with dangerouslySetInnerHTML
- How to get the changed (new) state value in React JS function with / without useEffect hook?
- How do I combine a string + javascript for a className?
- How to Sort comments to show the newest comments on top and old ones at the bottom in Express or React
- How to replace Panel Component with Card Component in React
- styled-components conditional props doesn't work in Material-ui components
- Conditional styling using Styled Components
- Styled Component dynamic tag name
- React Enzyme - modify internals of shallow rendered functional component
- Image is not showing up in react
- Nested comments in Reactjs
- React TypeScript: Saving a base64 string to useState
- Redirect in an exported function with react-router-dom without passing anything?
- In react project before does not work but after work
- Module not found: Can't resolve '...'
- Why after onClick my hook is failing to update the state?
- How do I define custom renderers for default Markdown elements using markdoc.io?
- Print fuzz if seconds is multiple of 3
- Why is my PhotoComponent not updating with the correct photos?
- Django cors not enable?
- Add sorting to MDBTable
- how to deal with asynchronous nature of setting state with hooks
- TypeError: venuesDates.map is not a function React
- React js and Redux : Objects are not valid as a React child
- How can I enable Hot Module Replacement(HMR) in react?
- Count the duplicates in a string array using React JS