账号密码登录
微信安全登录
微信扫描二维码登录

登录后绑定QQ、微信即可实现信息互通

手机验证码登录
找回密码返回
邮箱找回 手机找回
注册账号返回
其他登录方式
分享
  • 收藏
    X
    vue的v-model绑定不了json对象的第二层?
    43
    0

    问题描述

    有个表单,想用v-model绑定一个json对象下面的json,但是发现直接报错了

    问题出现的环境背景及自己尝试过哪些方法

    相关代码

     obj: {
              task:{
                endTime:this.time[1], //结束时间
                name:'',   //名称
                passMark:'',  //合格分数
                startTime:this.time[0], //开始时间
                totalCore:'',//总分
                createPracticeType: '1',//1 自动抽题 2 手动抽题
                status: '',// 1 正常 2 停用
    
              },
              ids: '', //用户id
              practiceIds: '',//题目id
              rule: []  //题目
            },

    下面这样用

             <el-form :model="obj.task">
                      <el-form-item label="出题方式:">
                        <el-radio v-model="obj.task.createPracticeType" label="1">自动抽取</el-radio>
                        <el-radio v-model="obj.task.createPracticeType" label="2">手动抽取</el-radio>
                      </el-form-item>
                      <el-form-item label="题库类型:">
                        <el-checkbox-group style="margin-bottom: 20px" v-model="is_question_roid.type"
                                           @change="shouDongSelectType">
                          <el-checkbox v-for="(item,index) in childTypeList" @change="optFor(index,$event)"
                                       :label="item.dictCode" :key="index">
                            {{item.dictName}}
                          </el-checkbox>
                        </el-checkbox-group>
                      </el-form-item>
                    </el-form>

    直接报空指针了。

    vue.runtime.esm.js?2b0e:1888 TypeError: Cannot read property 'task' of undefined
        at Proxy.render (eval at ./node_modules/cache-loader/dist/cjs.js?{"cacheDirectory":"node_modules/.cache/vue-loader","cacheIdentifier":"11fc2e0d-vue-loader-template"}!./node_modules/vue-loader/lib/loaders/templateLoader.js?!./node_modules/cache-loader/dist/cjs.js?!./node_modules/vue-loader/lib/index.js?!./src/views/issue/issue_exam.vue?vue&type=template&id=170d8555&scoped=true& (1.js:47), <anonymous>:57:61)
        at VueComponent.Vue._render (vue.runtime.esm.js?2b0e:3542)
        at VueComponent.updateComponent (vue.runtime.esm.js?2b0e:4060)
        at Watcher.get (vue.runtime.esm.js?2b0e:4473)
        at new Watcher (vue.runtime.esm.js?2b0e:4462)
        at mountComponent (vue.runtime.esm.js?2b0e:4067)
        at VueComponent.Vue.$mount (vue.runtime.esm.js?2b0e:8409)
        at init (vue.runtime.esm.js?2b0e:3118)
        at merged (vue.runtime.esm.js?2b0e:3301)
        at createComponent (vue.runtime.esm.js?2b0e:5972)

    请问要如何解决这个问题,为什么会这样呢?

    0
    打赏
    收藏
    点击回答
    您的回答被采纳后将获得:提问者悬赏的 11 元积分
        全部回答
    • 0
    • ︶走南闯北 普通会员 1楼

      在Vue中,如果你想要通过v-model绑定JSON对象的第二层,你需要确保你的JSON对象的第二层是可枚举的。这是因为v-model的第二个参数是用来绑定数据的,所以它需要一个可枚举的对象。如果你的JSON对象的第二层不是可枚举的,那么v-model就无法正常工作。

      以下是一个示例:

      ```html

      ```

      在这个示例中,我们有一个JSON对象obj,它有三个属性:nameagegender。我们还有一段HTML,它使用v-model来绑定这个JSON对象的第二层。因为namegender是可枚举的,所以我们可以正常地使用v-model来绑定它们。

    更多回答
    扫一扫访问手机版
    • 回到顶部
    • 回到顶部