vue怎么用v-model双向绑定Form表单

栏目分类：前端开发    发布日期：2023-06-09    浏览次数：477次     收藏

这篇文章主要介绍“vue怎么用v-model双向绑定Form表单”，在日常操作中，相信很多人在vue怎么用v-model双向绑定Form表单问题上存在疑惑，小编查阅了各式资料，整理出简单好用的操作方法，希望对大家解答”vue怎么用v-model双向绑定Form表单”的疑惑有所帮助！接下来，请跟着小编一起来学习吧！

vue初用antd 用v-model来双向绑定Form表单

第一次用vue使用ant designUI框架，还没从elementUI中转换过来…

于是在不能用Modal模态框，需要在页面传值接收的时候

    handleEdit (record) {
      this.$router.push({ path: '/form/base-form', query: { id: record, title: 'Edit' 			} })
    }

form页面接收：

init () {
      // 接收传递数据
      const { id, title } = this.$route.query
      this.param = id
      this.title = title
      this.temp = Object.assign({}, this.param)
    },

仍是用的v-model去绑定表单的值：

      <a-form-item
        label="Name"
        :labelCol="{lg: {span: 1}, sm: {span: 7}}"
        :wrapperCol="{lg: {span: 6}, sm: {span: 17} }">
        <a-input
          v-model="temp.name"
          v-decorator="[
            'name',
            {rules: [{ required: true, message: '请输入你的昵称' }]}
          ]"
          name="name"
          placeholder="昵称" />
      </a-form-item>

发现这里根本绑不上去啊o(