vue再读45-计算属性 基本使用

简介: vue再读45-计算属性 基本使用
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<style>
</style>
<body>
    <!-- 全局自定义指令 -->
    <div id="abc">
        {{msg}}
        <p>
            {{str}}
        </p>
    </div>
    <script src="./js/vue.js"></script>
    <script>
        /*  Vue.directive('focus', {
                                                            inserted(el) {
                                                                //该自定义指令的调用者
                                                                el.focus();
                                                            }
                                                        }) */
        var vm = new Vue({
            el: '#abc',
            //模板ajax返回的数据
            data: {
                //数据依赖另外一个数据
                msg: 'abc',
            },
            //局部自定义指令
            //通过computed计算
            computed: {
                str: function() {
                    return this.msg + 'xyz'
                }
            },
            methods: {
            },
        })
    </script>
    <!-- 列表渲染 -->
    <!-- 1渲染数组 -->
    <!-- 2c处理无数据的时候 -->
</body>
</html>

image.png

相关文章
|
2天前
|
JavaScript 测试技术
vue不同环境打包环境变量处理
vue不同环境打包环境变量处理
13 0
|
2天前
|
JavaScript
vue中高精度小数问题(加减乘除方法封装)处理
vue中高精度小数问题(加减乘除方法封装)处理
11 0
|
2天前
|
JavaScript
vue项目使用可选链操作符编译报错问题
vue项目使用可选链操作符编译报错问题
6 0
|
2天前
|
JavaScript
Vue项目启动报错处理
Vue项目启动报错处理
6 1
|
2天前
|
JavaScript 定位技术
vue项目开发笔记记录(二)
vue项目开发笔记记录
28 0
|
7天前
|
JavaScript API
vue 侦听器
vue 侦听器
|
7天前
|
JavaScript 算法 Linux
【vue报错】error:0308010C:digital envelope routines::unsupported
【vue报错】error:0308010C:digital envelope routines::unsupported
34 3
|
2天前
|
JSON JavaScript API
vue项目开发笔记记录(一)
vue项目开发笔记记录
29 0
|
2天前
|
JavaScript
Vue-实现点击空白处隐藏某节点
Vue-实现点击空白处隐藏某节点
9 1
|
2天前
|
缓存 JavaScript 前端开发
vue项目实战:实战技巧总结(中)
vue项目实战:实战技巧总结
27 1