qiniu / formstate-x

Manage state of form with ease.
https://qiniu.github.io/formstate-x
MIT License
34 stars 10 forks source link

`FormState` `set()` support #37

Closed nighca closed 3 years ago

nighca commented 3 years ago

Now we can code like this:

// now we construct array-form state with ArrayFormState
const namesState = new ArrayFormState(
  ['foo'],
  v => new FieldState(v)
)
namesState.value // ['foo']

// we can do set with array-form state
// it will update / remove / create child-field for us
namesState.set(['foo', 'bar'])
namesState.value // ['foo', 'bar']

// now reset of form state always reset to initial value
namesState.reset()
namesState.value // ['foo']

// we construct object-form state with FormState
const personState = new FormState({
  name: new FieldState('foo'),
  age: new FieldState(12)
})

// we can do set with object-form state, too
personState.set({
  name: 'bar',
  age: 24
})

personState.value // { name: 'bar', age: 24 }
nighca commented 3 years ago

mark: 需要补充下较复杂的列表校验场景的实现示例,如

nighca commented 3 years ago

所以现在 ArrayFormState 的 fields 想做增、删、更换位置等操作的时候 推荐的做法是?

@lzfee0227 我倾向是暂时跟之前一样,不用特意去用 set;在 #40 之后可能推荐的做法会调整

lzfee0227 commented 3 years ago

补充 case:

const form = new ArrayFormState([1, 2], initValue => { // + index ?
  const field = new FieldState(initValue)
  field.validators(value => {
    form.$.find(field)
  })
  return field
})