一、前言本文使用Vue完成了一个极简地址选择器，接下来带你实现。当然，也有一些值得学习和注意的地方。话不多说，先上demo图。因为每个人的需求不同，我这里就不实现更多的功能了，这样大家增删改查的空间就更大了。GitHub地址：Vue-location_Select2.需要学习的（1）数据更新Vue无法监听。首先要说的就是这一点。我们在Vue中的一个优势就是我们可以直接操作数据而不需要操作dom。但是这个其实有Vue无法监控的数据。比如数组和对象。当然，这只是指一小部分操作，大部分操作都没有问题。接下来说说Vue不能监控哪些数据操作1.数组由于JavaScript的限制，Vue不能检测到以下变化的数组：当你使用索引直接设置一个item时，例如：vm.items[indexOfItem]=修改数组长度时的newValue，例如：vm.items.length=newLength表示不能监听下面的情况，所以这样修改数组不会刷新视图varvm=newVue({data:{items:['a','b','c']}})vm.items[1]='x'//notresponsive,vm.items.length=2//notresponsiveactuallyawaytosolvebothAlsosimple//解决第一类问题vm.$set(vm.items,indexOfItem,newValue)//为了解决第二类问题，可以使用splice:vm.items.splice(newLength)这样Vue监视对阵列操作的更改。当然，还有以下Vue也可以监控的操作：push()pop()shift()unshift()splice()sort()reverse()2.Object由于JavaScript的限制，Vue无法检测添加或删除对象属性！这是关键点。如果动态添加对象属性，请注意添加对象属性的方式是否为$set，否则视图可能无法更新。varvm=newVue({data:{userProfile:{name:'Anika'}}})vm.userProfile.age=27;//看起来还可以，实际上vue是监控不到的，所以解决办法还是老办法，使用vm.$set(vm.userProfile,'age',27);使用Object.assign()添加多个属性也要注意用法//报错Object.assign(vm.userProfile,{age:27,favoriteColor:'VueGreen'})//正确vm.userProfile=Object.assign({},vm.userProfile,{age:27,favoriteColor:'VueGreen'})(二)V-for的用法1.这里直接遍历数组看代码就可以一目了然v-for="(val,index)inarr"//得到的是值和数组下标//通常是
