菜单切换
FACESOHO知行者
心灵
记录
远方
赞赏工具
源代码:
点击运行
保存
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>Vue 测试实例 - 小鸟启蒙(facesoho.com)</title> <script src="https://cdn.staticfile.org/vue/2.2.2/vue.min.js"></script> </head> <body> <div id="app"> <ul> <li v-for="(value,key,index) in object"> <p v-if="typeof value !='object'">{{value}}....{{ index }}</p> <p v-else>{{key}}....{{index}}</p> <ul v-if="typeof value == 'object'"> <li v-for="(value, key, index) in value"> {{key}}:{{value}}....{{ index }} </li> </ul> </li> </ul> </div><script> new Vue({ el:'#app', data:{ object:{ name:'小鸟启蒙', url:'http://www.facesoho.com', slogan:'学的不仅是技术,更是梦想!', obj2:{y:"嵌套对象的属性1",z:"嵌套对象的属性2"} } } })</script> </body> </html>
运行结果