Получение массива значений с множественным выбором из реакции-выбора в методе действия маршрутизатора 6

Я уже знаю, как использовать react-select и получать множественный выбор с onChange обновлением состояния (из предыдущих постов). Тем не менее, сейчас я изучаю react-router метод 6 действий и пытаюсь интегрировать react-select с ним. Маршрутизация через createBrowserRouter работает правильно, и метод действия срабатывает при нажатии кнопки SAVE. Это то, что у меня есть до сих пор:

const PostForm = (props) => {
  const options = [
    { value: 'chocolate', label: 'Chocolate' },
    { value: 'strawberry', label: 'Strawberry' },
    { value: 'vanilla', label: 'Vanilla' },
    { value: 'chdfdfdfd', label: 'chdfdfdfd' }
  ]
      
  return (
    <Card className = {styles.content}>
      <Form method = {props.method}>
        <p className = {styles.heading}>Create New</p>
        <input type = "text" name = "title" placeholder='Enter Title' />
        <input type='file' name='img' />
                
        <Select
          options = {options}
          isMulti
          maxMenuHeight = {150}
          menuIsOpen = {true}
          isSearchable = {true}
          placeholder='Select Main Cast'
          className = {styles.select}
          name='lstCast'
          id='lstCast'
        />

        <Button handleClick = {handlerCancel}>Cancel</Button>
        <Button type='submit' className = {styles.submitBtn}>
          Save
        </Button>
      </Form>
    </Card>
  )
}

export default PostForm;

export async function action({ request, params }) {
    console.info(request.method) // working correctly, outputting 'POST'
    const data = await request.formData()

    console.info(data.get('title')) // working correctly
    console.info(data.get('lstCast')) // outputting only first selected value of the multi-selection     
    ...
}

Данные, введенные в поля ввода, правильно выводятся в action method при нажатии кнопки SAVE. Однако он выводит только первое выбранное значение множественного выбора REACT-SELECT. Кто-нибудь знает, как вывести ВСЕ выбранные значения множественного выбора REACT-SELECT в методе действия? "react-router-dom": "^6.10.0", "react-select": "^5.7.3".

Обновление: я добился некоторого прогресса, но еще не полностью решен. Я создал некоторое состояние и обновлял его при изменении React-SelectonChange. Затем это состояние привязывается к скрытому полю ввода, поэтому formData будет читать его в методе действия следующим образом:

const PostForm=(props)=>{
    const options = [
        { value: 'chocolate', label: 'Chocolate' },
        { value: 'strawberry', label: 'Strawberry' },
        { value: 'vanilla', label: 'Vanilla' },
        { value: 'chdfdfdfd', label: 'chdfdfdfd' }
      ]

    const [selectedValues, setSelectedValues] = useState({})

    //useEffect(()=>{
    //    console.info(selectedValues) // printing out correctly
    //},[selectedValues])
      
    return(
        <Card className = {styles.content} >
            <Form method = {props.method} className = {styles.form} >
                <h2 className = {styles.heading} >Create New Film</h2>
                <input type = "text" name = "title"  placeholder='Enter Title' />
                <input type='file' name='img' />

                <Select 
                    options = {options} 
                    isMulti 
                    maxMenuHeight = {150} 
                    menuIsOpen = {true} 
                    isSearchable = {true}
                    placeholder='Select Main Cast' 
                    className = {styles.select} 
                    onChange = {setSelectedValues} />

                <input name='lstCast' value = {selectedValues} hidden readOnly />

                <Button handleClick = {handlerCancel}>Cancel</Button>
                <Button type='submit' className = {styles.submitBtn}>
                  Save
                </Button>
            </Form>
        </Card>
    )
}
export default PostForm;


export async function action({request, params}){
    const data = Object.fromEntries(await request.formData())
    console.info(data)
    console.info(data.title) // prints correctly
    console.info(data.lstCast) // prints [object Object] for each item selected 
}

Выход:

Я выбрал 3 значения из ответа-выбора, но оно печатается как [object Object],[object Object],[object Object] в методе действия, в то время как оно правильно печатается в (закомментировано) useEffect в PostForm. Как я могу получить значения объекта, который был передан из скрытого ввода в метод действия?

коды и ящик