“UI Bahan Autocomplete Terkontrol” Kode Jawaban

UI Bahan Autocomplete Terkontrol

<Controller
  defaultValue={null}
  name={"name"}
  control={control}
  rules={{
    required: true, // for mandatory field
    validate: (data) => { // checking whether array is empty or not
    	if(data.length === 0) return false 
    }}
  }
  render={({value, name, onChange}) => (
  	<Autocomplete
      value={value}
      multiple
      name={name}
      size="small"
      id="status"
      options={options}
      disableCloseOnSelect
      onChange={(e, v) => {onChange(v);} }
      getOptionLabel={(option) => option.name}
      renderOption={(props, option, { selected }) => (
        <li {...props}>
          <Checkbox
          icon={icon}
          checkedIcon={checkedIcon}
          style={{ marginRight: 8 }}
          checked={selected}
        />
        	{option.name}
        </li>
      )}
      style={{ width: 250 }}
      renderInput={(params) => (
      	<TextField {...params} /* error={errors.name ? true : false} */ variant="outlined" label="Select" />
      )}
    />
  )}
/>
Himanshu Makwana

material ui autocomple bagaimana membuat opsi pertama dipilih sebagai default

<Autocomplete
    id="id"
    options={Options}
    getOptionLabel={option => option.label}
    defaultValue={Options.find(v => v.label[0])} 
    renderInput={params => (
      <TextField {...params} label="label" variant="outlined" />
    )}
  />
Jash_World

Cara Mengatur Autocomplete Dinamis dengan UI Material

 import React, { useState } from 'react';
using useState:

   const [val,setVal]=useState({})
changin value on click of button

  const handleClick = () => {
    setVal(top100Films[0]);//you pass any value from the array of top100Films
   // set value in TextField from dropdown list
 };
and pass this value to component in render

 <Autocomplete
   value={val}
    options={top100Films}
    getOptionLabel={option => option.title}
    style={{ width: 300 }}
    renderInput={params => (
      <TextField
        {...params}
        label="Combo box"
        variant="outlined"
        fullWidth

      />
    )}
  />
Pleasant Pintail

Jawaban yang mirip dengan “UI Bahan Autocomplete Terkontrol”

Pertanyaan yang mirip dengan “UI Bahan Autocomplete Terkontrol”

Lebih banyak jawaban terkait untuk “UI Bahan Autocomplete Terkontrol” di JavaScript

Jelajahi jawaban kode populer menurut bahasa

Jelajahi bahasa kode lainnya