有一个多数组，其中一个选项集被创建，这工作正常

const groups1 = OrgServices.reduce((all, cur) => ((all[cur.grouptype] ??= []).push(...cur.servicetype), all), {});
     const output1 = Object.entries(groups1).map(([k, v]) => ({ grouptype: k, servicetype: v }));

<select id="type" name={'type'} 
                            onChange={(e: any) => {setTypeOfService(e.target.value)}} 
                            className="block w-full rounded-md border-0 py-1.5 text-gray-900 shadow-sm ring-1 ring-inset ring-gray-300 placeholder:text-gray-400 focus:ring-2 focus:ring-inset focus:ring-indigo-600 sm:text-sm sm:leading-6"
                > 
                <option>Select Service Type:</option>
                {output1.map((service) => {return service.servicetype.map(element => {return ( <option key={service.id}> {service.grouptype} - {element.name} </option>)})})}

                
                </select>

但我也想在元素部分使用其他值来表示之后发生的文章的其他部分。
因此，元素有多个值name，price，type等，但我想在我的创建按钮上传递它们，而不仅仅是www.example的值 www.example.com