Shulou(Shulou.com)05/31 Report--

This article mainly introduces vue how to add new objects to the array and assign the relevant knowledge, the content is detailed and easy to understand, the operation is simple and fast, has a certain reference value, I believe that after reading this vue how to add new objects to the array and assign values to the article will have a harvest, let's take a look.

Add a new object to the array and assign method 1

There is only one set that applies to arrays.

ListData: [{name: "Zhang San", age:18}], / / directly add object listData.sex= "male" method 2

Suitable for multiple sets of information in an array

ListData: [], list: [{"Zhang San", "Li Si"}] / / for example, you want to add the values listed in another array to this array for (let index = 0; index)

< this.listlist.length; index++) { this.listData.push({ name: "" }); this.listData[index].name= this.list[index]; }数组赋值踩过的坑及解决 最近需要在Vue当中完成动态赋值数组操作，从服务器拿到数据后，刷新数组中的数据，但是发现无论使用什么方法都不行，通过打log,发现数据在这里就无法向下执行，而且也没有报任何的异常，最终问题解决，在这里做个记录。 Vue中的数组赋值和在普通的JS中赋值还是有所区别。 以下操作可以引起界面刷新：push，pop ，unshift，shift，reverse，sort，splice 以下操作不会引起界面刷新：slice，concat ，filter 还有一点需要注意： 如果通过直接赋值或者改变长度是无法让界面刷新的。 （1）通过索引直接设置项。 （2）修改数组长度，mylist.length=3 第二点，在从服务器中获取数据后赋值需要注意一个问题：主体对象的改变。 比如在使用axios对象发起请求后，在返回方法中处理数据需要注意： 注意在axios的then方法中调用对象时，不能使用this对象，因为此时this对象指的是axios实例，所以通过this是获取不到vue实例中的data数据的，必须在外界使用一个值来指向vue实例对象，通过这个外部对象来赋值，才是正确的。 var self;created:function(){self = this;},mouted:function(){ axios.create({ baseURL: 'url', timeout: 10000, headers: { 'Content-Type': 'application/json' } }).get('xxxxxxxxxx') .then(function(response){ if(response.data.dataList.length>

0) {var datalist = response.data.dataList; for (var itemositani

Welcome to subscribe "Shulou Technology Information " to get latest news, interesting things and hot topics in the IT industry, and controls the hottest and latest Internet news, technology news and IT industry trends.