Vue 学习 2019-3-12 11:32:18

迷南。 2022-03-09 03:58 65阅读 0赞

前言：观看[https://www.bilibili.com/video/av22950780][https_www.bilibili.com_video_av22950780]

Vue CDN ：<script src="https://cdn.bootcss.com/vue/2.6.8/vue.js"></script>

## 过滤器 filters ##

用法 \{ \{massage | （函数名）|（函数名）\}\}  <--html

filters:\{

（函数名）：function(value)\{

return (值)；

\}，

\}，<--script

## 计算属性 computed ##

用法 \{ \{massage\}\}\{ \{massage1\}\}\{ \{massage2\}\}

computed:\{

massage1:function()\{

return (计算值)；

\}，

massage2:function()\{

return (计算值)；

\}，

\}，

## 监控属性 $watch ##

<div id="myApp">
            <p>{
       {p1}}===={
       {p2}}===={
       {p3}}</p>
            <button @click="btn1000(1000)">加1000</button> 
    </div>
    <script>
            var myApp = new Vue({
                el:'#myApp',
                data:{
                    p1: 123,
                    p2: 666,
                    p3: 777,
                },
                watch:{ //监控属性
                    p1:function(new1,old2){
                        console.log(new1,old2);
                    },
                },
                methods:{ 
                    btn1000:function(add1000){
                        this.p1 += add1000;
                    }
                }
            });
    </script>

[https_www.bilibili.com_video_av22950780]: https://www.bilibili.com/video/av22950780

发表评论取消回复

表情：

评论列表（有 0 条评论，65人围观）

还没有评论，来说两句吧...

相关阅读

相关 Vue学习：创建Vue

一、安装Node.js和NPM 1.安装node.js 从node.js官网下载并安装node.js 网址： [Download | Node.js][Downlo

àì夳堔傛蜴生んèń/ 2023年10月14日 18:53/ 0 赞/ 117 阅读

相关 Vue学习：vue生命周期

Vue实例有一个完整的生命周期，也就是从开始创建、初始化数据、编译模板、挂载Dom、渲染→更新→渲染、卸载等一系列过程，我们称这是Vue的生命周期。通俗说就是Vue实例从创建到

矫情吗；*/ 2023年10月04日 19:46/ 0 赞/ 142 阅读

相关 VUE学习：vue简介、vue指令

一、Vue简介 Vue (读音 /vjuː/，类似于 view) 是一套用于构建用户界面的渐进式框架。与其它大型框架不同的是，Vue 被设计为可以自底向上逐层应用。Vue

Love The Way You Lie/ 2023年10月04日 19:41/ 0 赞/ 181 阅读

相关 VUE学习

一、什么是VUE 前端三大框架之一（另外两个分别是Angular和React），它结合了Angel的模块化和React的虚拟Dom的特点，优化前端开发。 Vue是一个M

末蓝、/ 2023年09月28日 16:59/ 0 赞/ 9 阅读

相关 vue-cli中学习vue

vue部分知识 > 大部分学习内容及代码在[gitee仓库][gitee] 生命周期基本介绍 <table> <thead> <tr>

痛定思痛。/ 2023年09月23日 18:10/ 0 赞/ 176 阅读

相关 Vue学习笔记：Vue CLI 3的学习

定义 Vue CLI官方定义：Vue CLI 是一个基于 Vue.js 进行快速开发的完整系统，提供诸多功能。例如：通过 @`vue/cli` 搭建交互式的项目脚手架；通

港控/mmm°/ 2023年08月17日 16:35/ 0 赞/ 225 阅读

相关 Vue学习

Vue Vue是一个构建用户界面(UI)的\[渐进式\]JavaScript框架官网：[https://cn.vuejs.org/][https_cn.vuejs.

不念不忘少年蓝@/ 2022年12月10日 10:29/ 0 赞/ 77 阅读

相关 Vue学习

[JavaScript Event Loop 机制详解与 Vue.js 中实践应用][JavaScript Event Loop _ Vue.js] [Vue2.0 新手完全

Dear 丶/ 2022年06月08日 06:26/ 0 赞/ 66 阅读

相关 Vue学习笔记——Vue-router

第1节：Vue-router入门 1、解读router/index.js文件 import Vue from 'vue' //引入Vue

小鱼儿/ 2022年05月19日 03:05/ 0 赞/ 331 阅读

相关 Vue学习

视频教程：http://www.iqiyi.com/w\_19rwwv678d.html?list=19rrlrqa3a 官网教程：https://cn.vuejs.org/

古城微笑少年丶/ 2021年11月04日 14:26/ 0 赞/ 137 阅读