vue 数组动态的添加值,但是值已经添加上了,但是没法渲染

蒋恒
  • 28

vue 数组动态的添加值name,name值已经添加上了,但是没法渲染。是否是同步异步的问题,或者重新加载数据,我要如何编写

            <div>
                <legend>配方信息</legend>
                <div class="layui-inline" v-for="p in priceList">
                    <label class="layui-form-label">{{p.name}}</label>
                    <div class="layui-input-inline" style="width: 100px;">
                        标准量:
                        <input type="text" name="model" class="layui-input" v-model="p.std">
                    </div>
                    <div class="layui-input-inline" style="width: 100px;">
                        最大量:
                        <input type="text" name="model" class="layui-input" v-model="p.max">
                    </div>
                    <div class="layui-input-inline" style="width: 100px;">
                        最小量:
                        <input type="text" name="model" class="layui-input" v-model="p.min">
                    </div>
                </div>
            </div>
            
            <script>
                    var terminalForm = new Vue({
            el: '#terminalForm',
            data: {
                t: data ? data : {},
                priceList: [],
                suee: false
            },
            create: function () {
                var that = this
                that.priceList = that.t.recipes
                $.get('api/product/list_ingredient').then(function (res) {
                    var recipes = that.priceList;
                    var priceName = res.data;
                    for (var i in recipes) {
                        for (var j in priceName) {
                            if (recipes[i].ingredientId == priceName[j].id) {
                                recipes[i].name = priceName[j].name;
                            }
                        }
                    }
                })

                console.log(that.priceList)
                that.suee = true
            },
        });
            
            </script>
评论
阅读 4.6k
3 个回答
✓ 已被采纳
由于 JavaScript 的限制,Vue 不能检测以下变动的数组:
当你利用索引直接设置一个项时,例如:vm.items[indexOfItem] = newValue
当你修改数组的长度时,例如:vm.items.length = newLength

利用这些 函数进行操作
push()
pop()
shift()
unshift()
splice()
sort()
reverse()
或者对list 重新赋值 即可 list = newList
或者 list.splice(0, list.length -1) 然后 重新 push 一遍

再看看 vue 官网 列表渲染吧

Object.assign({},)

宣传栏