zoukankan      html  css  js  c++  java
  • computed Option 计算选项

    <!DOCTYPE html>
    <html lang="en">
    <head>
        <meta charset="UTF-8">
        <title>computed Option  计算选项</title>
        <meta name="flexible" content="initial-dpr=2,maximum-dpr=3" />
        <meta name="apple-mobile-web-app-capable" content="yes">
        <meta content="yes" name="apple-touch-fullscreen">
         <meta content="telephone=no,email=no" name="format-detection">
        <meta content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no" name="viewport">
        <script src="../assets/js/flexible_css.js"></script>
        <script src="../assets/js/flexible.js"></script>
        <script src="../assets/js/vue.js"></script>
    </head>
    <body>
    <div id="app">
        <p>{{newPrice}}</p>
        <ul>
            <!-- <li v-for="item in items">{{item.title}}-{{item.date}}</li>   正常循环输出 -->
            <li v-for="item in reverseNews">{{item.title}}-{{item.date}}</li>
        </ul>
    </div>
        
    </body>
    <script type="text/javascript">
        var newsList=[
            {title:'香港或就“装甲车被扣”事件追责 起诉涉事运输公司',date:'2017/3/10'},
            {title:'日本第二大准航母服役 外媒:针对中国潜艇',date:'2017/3/12'},
            {title:'中国北方将有明显雨雪降温天气 南方阴雨持续',date:'2017/3/13'},
            {title:'起底“最短命副市长”:不到40天落马,全家被查',date:'2017/3/23'},
            
          
        ];
        var app=new Vue({
            el:'#app',
            data:{    
                price:100,
                items:newsList        
            },
            computed:{   //computed 的作用主要是对原数据进行改造输出。
                newPrice:function(){
                    return this.price='¥'+this.price+'';
                },
                reverseNews:function(){
                    return this.items.reverse();  //reverse  反转容器内容   不实排序 不打乱顺序
                }
            }
        })
    </script>
    
    </html>
  • 相关阅读:
    centos7添加firewalld规则
    centos7安装redis5
    Oracle 监听
    创建Oracle表空间及用户
    nginx+keepalive
    oracle 修改端口
    Oracle新建数据库
    Redhat7.5安装JBOSS4.2.0
    kubernetes的一些基本命令
    安装python3.6后使用pip报错
  • 原文地址:https://www.cnblogs.com/jinsuo/p/8483158.html
Copyright © 2011-2022 走看看