专栏首页LaravelCodeVuejs 对象迭代

Vuejs 对象迭代

js 对象迭代 日常生活中,开发后端给的很多元素都将会是一个对象,但有时候我们并不知道这个对象都有哪些字段。因此 js 的对象迭代可以很方便的解决此类问题

html:

<div id="myApp">
    <h1>JS对象迭代</h1>
    <div v-for="(value, key) in mygame">
        {{key}} : {{value}}
    </div>
</div>

JavaScript

<script>
    var myApp = new Vue({
        el: '#myApp', 
        data: {
            mygame: {
                title: "乌贼娘2代",
                price: 350,
                pubdate: "2017年夏季",
                category: "射击",
                agerange: "全年龄",
            },
        },
    });
</script>         

本文参与腾讯云自媒体分享计划,欢迎正在阅读的你也加入,一起分享。

我来说两句

0 条评论
登录 后参与评论

相关文章

  • PHPStorm + Homestead 配置 Xdebug

    常生活中百分之一万的情况下,我们在和 BUG 打交道,遇到问题我们该怎么办呢?有经验的话猜也能猜八九不离十,但是完事不可能靠猜来解决,所以有时候得追踪到 bug...

    hedeqiang
  • 通过 Laravel 创建一个 Vue 单页面应用(六)

    我们将完成基本 CURD 的最后一部分:创建新用户。您已经拥有了我们之前讨论过的主题中所需要的所有工具,因此可以尝试创建用户并将本文与您的工作进行比较。

    hedeqiang
  • 解决安装WordPress主题及插件需要输入FTP问题

    安装一个WordPress好像挺简单,但是默认主题不喜欢,想更换一个,无奈本地可以更换,但是服务器更换的时候需要设置FTP 。OK,设置呗,好像我的用户名密码之...

    hedeqiang
  • jquery样式操作

    选择器获取的多个元素,获取信息获取的是第一个,比如:$("div").css("width"),获取的是第一个div的width。

    Devops海洋的渔夫
  • 模板引擎(比如ejs)中如何显示markdown语法编写的内容

    版权声明:本文为博主原创文章,未经博主允许不得转载。 https://blog.csdn.n...

    acoolgiser
  • NEC html规范

    HTML规范 - 整体结构 HTML基础设施 文件应以“<!DOCTYPE ......>”首行顶格开始,推荐使用“<!DOCTYPE html>”。 必须申明...

    用户1197315
  • vue 组件基本使用

    组件是可复用的 Vue 实例,且带有一个名字。把这个组件作为自定义元素来使用。组件的好处是写一次可以进行任意次数的复用

    章鱼喵
  • 清除浮动的方法

    本章主要介绍三种常用的清除浮动的方法,主要包括: ---- [1] 增加一个空 div, 使用 clear:both 将浮动元素 "挤到" 父元素中 [2] ...

    echobingo
  • CSS入门12-浮动与清除浮动

    (注1:如果有问题欢迎留言探讨,一起学习!转载请注明出处,喜欢可以点个赞哦!) (注2:更多内容请查看我的目录。)

    love丁酥酥
  • 一天带入门到放弃vue.js(三)

    自己新建的标签赋予特殊功能的是组件,而指定是在标签上使用类似于属性,以v-name开头,v-on,v-if...是系统指令! v-是表示这是vue的指令if,f...

    十月梦想

扫码关注云+社区

领取腾讯云代金券