How to use the @alicloud/console-components.Field.useField function in @alicloud/console-components

const Demo4 = () => {
  const myField = Field.useField()

  const { init, getError, setError, setErrors } = myField
  return (
    
      <input>
      <br>

const Demo10 = () => {
  const myField = Field.useField({
    parseName: true,
    values: {
      objWithDefaults: {
        a: 1,
        b: 2,
      },
    },
  })

  const onGetValue = () => {
    console.log(myField.getValues())
  }

  const onSetValue = () => {
    myField.setValues({
      obj: {

const Demo7 = () => {
  const myField = Field.useField({
    deepReset: true,
  })
  const { init } = myField

  return (
    <div>
      <select style="{layout}">
        jack
        lucy
        
          disabled
        
        hugohua
      </select>
      <br>
</div>

const Demo8 = () => {
  const myField = Field.useField()
  const { init } = myField

  return (
    <div>
      
        checked
      
      <br>
      
        defaultChecked
      
      <br>
      </div>

const Demo3 = () => {
  const myField = Field.useField({
    onChange: (name, value) => {
      console.log(myField.getValues())
      switch (name) {
        case 'input':
          myField.setValue('sync', `change to: ${value}`)
          break
        case 'select':
          myField.setValue('sync', `${value} is coming`)
          break
        case 'range':
          myField.setValue('sync', ` (${value.join(',')}) ready`)
          break
      }
    },
  })

const Demo2 = () => {
  const myField = Field.useField()
  const { init } = myField
  return (
    <div>
      <input value=""> {
            if (value.match(/##/)) {
              return value
            }
            return `## title-${value}`
          },
        })}
      /&gt;
      <button type="primary"> {</button></div>

const Demo6 = () => {
  const myField = Field.useField()
  const { init } = myField

  return (
    <form>
      
        <p>
          The quick brown fox jumps over the lazy dog.
        </p>
        <p>
          <a href="#">Link</a>
        </p>
      
      
        }
          align="r"</form>

const Demo11 = () => {
  const myField = Field.useField()

  const userExists = (rule, value) => {
    return new Promise((resolve, reject) => {
      if (!value) {
        resolve()
      } else {
        setTimeout(() => {
          if (value === 'frank') {
            reject([new Error('Sorry, this username is already occupied.')])
          } else {
            resolve()
          }
        }, 500)
      }
    })
  }