1. Add attributes and modify the value
method: this.$set(this.obj,'key',value)
or
var vm = new Vue({…})
vm.set(this.obj, “key”, value )
var demo={
a:"1",b:"2"}
this.$set(demo,"c","3")
console.log(demo)//{a:"1",b:"2",c:"3"}
//如果对象中存在该key值,那么就不是新增属性,而是修改该key值的value值
this.$set(demo,"c","4")
console.log(demo)//{a:"1",b:"2",c:"4"}
//扩展数组的
this.$set(arr, index, value)
或者
var vm = new Vue({
..})
vm.set(arr, index, value)
案例:
var a=["1","2","3"]
this.$set(a,2,"4")
console.log(a)//["1","2","4"]
this.$set(a,3,"5")
console.log(a)//["1","2","4","5"]
2. Modify the attribute key value
//案例:把selected改为checkAll
var demo={
selected:false}
// 复制原来的值
demo['checkAll'] = demo[ 'selected' ]
//删除原来的key
this.$delete(demo,'selected')
console.log(demo)//{checkAll:false}
3. Delete the attribute
this.$delete(obj,'key')
//案例 删除属性name
var data = {
name: 'xxx', status: 0}
this.$delete(data,'name')
console.log(data)//{status:0}
4. Filter properties
Object.keys() returns a string array representing all enumerable properties of a given object
var obj = {
foo: 'bar', baz: 42 };
console.log(Object.keys(obj)); // ['foo', 'baz']
//案例:筛选出对象的第一个属性
var list = [
{
melonbody: 8.4, strName: '损伤程度', level: '一等品' },
{
colorvalue: 8.42, strName: '颜色', level: '一等品' },
{
diameter: 8.4, strName: '直径', level: '一等品' },
{
melonbody: 6.41, strName: '损伤程度', level: '二等品' },
{
colorvalue: 6.4, strName: '颜色', level: '二等品' },
{
diameter: 6.42, strName: '直径', level: '二等品' },
{
melonbody: 4.41, strName: '损伤程度', level: '三等品' },
{
colorvalue: 4.41, strName: '颜色', level: '三等品' },
{
diameter: 4.42, strName: '直径', level: '三等品' }
];
var demo2=[]
for (var i in list){
demo2.push(Object.keys(list[i]))
}
var demo3 = []
for(var i in demo2){
demo3.push(demo2[i][0])
}
var demo4=[...new Set(demo3)]
console.log(demo4)//['melonbody','colorvalue','diameter']
There are many ways to continue