美文网首页
(二)computed计算选项

(二)computed计算选项

作者: 我拥抱着我的未来 | 来源:发表于2018-02-15 16:23 被阅读0次

本节知识点

  • 使用computed

概述

  • computed的作用就是对原数据进行改造输出,改造输出包括:格式的输出,大小写转换,顺序重排,添加符号等。

(一) 格式化输出

  • 原始数据就是price:100但是我们给用户输出的变成 ($100)
<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="initial-scale=1.0,maximum-scale=1.0">
    <title>Title</title>
    <script src="js/vue.js"></script>
</head>
<body>
  <div id="app">
    <hello :info="message2"></hello>
  </div>
</body>
<script>
    Vue.component("hello",{
        template:"<p style='color:red'>{{info}}</p>",
        props:['info']
    })
    var app = new Vue({
        el:"#app",
        data:{
            message:"100"
        },
        computed:{
            message2:function(){
                return "$"+this.message
            }
        }
    })
</script>
</html>

相关文章

网友评论

      本文标题:(二)computed计算选项

      本文链接:https://www.haomeiwen.com/subject/xbhutftx.html