<CreatableSelect
value={goal}
options={goalOptions}
onChange={(e) => {setGoal(e)}}
placeholder="Select... or type your own!"/>
<div>{goal.length}</div>
this only gives the length of the goal after the user presses enter, but is there a way to constantly update the length as the user writes?
You should declare goal and setGoal as state.
example:
import React, { useState } from 'react'
const MyFunctionalComponent = () => {
const [goal, setGoal] = React.useState('')
return (<>
<CreatableSelect value = {goal}
options = {goalOptions}
onChange = {(e) => {setGoal(e)}}
placeholder = "Select... or type your own!"
/>
<div>{goal.length}</div>
</>)
};