前端随心记---------vuejs基础学习2.2

过滤器

filter过滤器,说白了就是一个函数。

在vuejs1.版本里面存在很多过滤器,在vuejs2.版本里面被移除

存在两种方式定义过滤器   : 1.全局     2.局部

全局:

Vue.filter(‘filterName1‘, function(input, ...ret){
    return ;
});

Vue.filter(‘filterName2‘, function(input, ...ret){
    return ;
});

局部:

new Vue({
    el: ‘‘,
    filters: {
        filterName1: function(input, ...ret){
            return ;
        },
        filterName2: function(input, ...ret){
                    return ;
                }
    }
})

函数和过滤器的差异:调用的方式不一样,其他一样。

1.过滤器  模型变量 | 过滤器1 |过滤器2  。可以多次使用

2.函数直接加上()

computed 计算属性

1.某个值的状态依赖于其他的值。

2.computed 可以进行缓存,如果依赖的值没有变化,computed里面的代码不会在执行,直接使用上次的缓存的结果。

函数和过滤器和computed差异:

1.computed 依赖于其他的数据

2.computed 值会进行缓存

3.computed  是存在get和set

4.computed 一般情况下只需要get方法定义


es5里面的一些 api  重点看看
1. forEach 会不会改变数组本身(1. 元素基本数据类型不变 2. 元素复合数据类型,是收到影响)
2. filter 回调函数返回 false 这一项不会被保留
3. every 数组内元素状态全部为true,则最终的结果为 true,但凡有一个为 false,则最终的结果为 false
4. reduce 求和

原文地址:https://www.cnblogs.com/hudunyu/p/11428929.html

时间: 2024-11-06 03:37:07

前端随心记---------vuejs基础学习2.2的相关文章

前端随心记---------vuejs基础学习3.0

watch ch 和cpmpute的区别: 1.watch 表示监听某个模型变量的状态变化.watch监视的东西多一些,computed所依赖的东西都写在一个函数里. 2.特殊场景:如果业务出现了异步操作(回调函数)则这个时候computed是存在返回值,不能在使用,但是watch里面的没有返回值的概念,可以进行异步代码的调用. 小案例代码: <script type="text/javascript"> var vm = new Vue({ el: '#box', dat

前端随心记---------vuejs流行的UI框架

一:Element element ui框架的按钮组件,这款由饿了么前端开源的UI框架,一经面世,就收获大量程序员的芳心.在github 上更是高达29.8k的star早已说明一切.用于开发PC端的页面还是绰绰有余的.如果说你是用vue开发者,却没用过element UI,那你肯定不是合格的vue开发者. 文档地址:http://element-ui.cn 二:iview iView 是一套基于 Vue.js 的开源 UI 组件库,主要服务于 PC 界面的中后台产品.使用单文件的 Vue 组件化

前端随心记---------HTTP基础

   HTTP HTTP协议(HyperText Transfer Protocol,超文本传输协议)是因特网上应用最为广泛的一种网络传输协议,所有的WWW文件都必须遵守这个标准.HTTP是一个基于TCP/IP通信协议来传递数据 HTTP 工作原理 HTTP协议工作于客户端-服务端架构上.浏览器作为HTTP客户端通过URL向HTTP服务端即WEB服务器发送所有请求.Web服务器有:Apache服务器,IIS服务器(Internet Information Services)等.Web服务器根据接

前端随心记---------vue3.0终于来了,作者已公布源码

Vue3.0 何去何从? 就在国庆的第五天,10月5日凌晨,web前端开发框架Vuejs的作者:尤雨溪在微博宣布Vue3.0版本终于要面正式推出了!  其实,在11月14日-16日于多伦多举办的 VueConf TO 2018 大会上,尤雨溪发表了名为 “ Vue 3.0 Updates ” 的主题演讲,对 Vue 3.0 的更新计划.方向进行了详细阐述. 1.更快 Virtual DOM 完全重写,mounting & patching 提速 100% : 更多编译时(compile-time

前端随心记(一)

前端 基础易错题(一) 案例一::介绍js原型链继承原理,以及prototype和--proto--的区别! 1.任何一个构造函数都有一个属性prototype叫做构造函数的原型,是一个对象,并且该对象默认情况下指向Object实例,constructor指向当前构造函数,--proto--指向Object.protopyte. 2.使用构造函数实例化的对象存在一个--proto--属性,指向当前构造函数的prototype. 3.当我们调用实例对象的属性和方法时,先在自身上面进行查找[自己身上

前端随心记---------React简介(1)

React 简介: React 是一个用于构建用户界面的 JAVASCRIPT 库. React 主要用于构建UI,很多人认为 React 是 MVC 中的 V(视图). React 起源于 Facebook 的内部项目,用来架设 Instagram 的网站,并于 2013 年 5 月开源. React 拥有较高的性能,代码逻辑非常简单,越来越多的人已开始关注和使用它. React诞生的原因 主要是当时市面上的这些框架都无法满足 facebook 公司的业务需求 (1. 数据量很大,数据不好管理

前端随心记---------简单.可扩展的状态管理工具MobX

Mobx是一个功能强大,上手非常容易的状态管理工具.就连redux的作者也曾经向大家推荐过它,在不少情况下你的确可以使用Mobx来替代掉redux. MobX: MobX 是一个经过战火洗礼的库,它通过透明的函数响应式编程(transparently applying functional reactive programming - TFRP)使得状态管理变得简单和可扩展.Mobx 就是一个集中化管理数据的库,类似之前学习的 vuex 和 redux. 为什么要使用它呢? 在单页项目中,实现组

前端随心记---------HTML5+CSS系列3.0

表单 u 表单的作用:用来收集用户的信息的; 表单框 : 表单 ?表单的作用:用来收集用户的信息的; 表单框 : <form name="表单名称" method="post/get" action="提交地址"> </form> <input type="text" value="默认值"/> 文本框 <input type="password"

前端随心记---------vuex

为什么会出现vuex? 在一些大型应用中,有时我们会遇到单页面中包含着大量的组件及复杂的数据结构,而且可能各组件还会互相影响各自的状态,在这种情况下组件树中的事件流会很快变得非常复杂也使调试变得异常困难.为了解决这种情况,我们往往会引入状态管理这种设计模式,来降低这种情况下事件的复杂程度并且使调试变得可以追踪.而 Vuex 就是一个专门给为 Vue.js设计的状态管理架构. vuex 概述 Vuex 是状态管理模式的一种实现库,主要以插件的形式和 Vue.js 进行配合使用,能够使我们在 Vue