广告
返回顶部
首页 > 资讯 > 前端开发 > JavaScript >Vue的方法和属性案例详解
  • 477
分享到

Vue的方法和属性案例详解

2024-04-02 19:04:59 477人浏览 安东尼
摘要

Vue的方法和属性 1.方法 methods 用法1 methods:{ 方法名:function(){}, } 用法2 methods:{ 方法名(){} } 注意 {{}

Vue的方法和属性

1.方法 methods

用法1

methods:{
方法名:function(){},
}

用法2

methods:{
方法名(){}
}

注意

{{}}调用要写()

示例

{{aa()}}

事件触发

@click=aa"可以有()也可以没有如果需要传参,加上()
把$event这个特殊参数传进去可以获取事件对象

2.计算属性

计算属性是什么

computed

计算属性的特点

  1. 计算属性有缓存
  2. 计算属性是基于他们的依赖进行缓存的
  3. 计算属性只有在他的相关依赖发生改变时才会重新求值当
  4. 计算属性所依赖的属性发生变化时他会重新计算一次

计算属性中的方法

set(da)
get()

示例


 	computed:{
                 //计算属性
                 //计算属性有缓存
                 //直接{{}}调用不用写()
                 //当计算属性所依赖的属性发生变化时他会重新计算一次

                 bb(){
                    return this.arr.filter(a=>a.indexOf(this.search) > -1)
                 },
                 cc:{
                     //调用计算属性时自动触发get方法,修改计算属性时自动触发set方法
                     set(a){
                        console.log('我是set'+"接收的内容"+a+"接收的内容")
                     },
                     get(){
                        console.log('我是get')
                        return this.arr.filter(a=>a.indexOf(this.search) > -1)

                     }
                 }
            },

到此这篇关于Vue的方法和属性案例详解的文章就介绍到这了,更多相关Vue的方法和属性内容请搜索编程网以前的文章或继续浏览下面的相关文章希望大家以后多多支持编程网!

--结束END--

本文标题: Vue的方法和属性案例详解

本文链接: https://www.lsjlt.com/news/131381.html(转载时请注明来源链接)

有问题或投稿请发送至: 邮箱/279061341@qq.com    QQ/279061341

本篇文章演示代码以及资料文档资料下载

下载Word文档到电脑,方便收藏和打印~

下载Word文档
猜你喜欢
  • Vue的方法和属性案例详解
    vue的方法和属性 1.方法 methods 用法1 methods:{ 方法名:function(){}, } 用法2 methods:{ 方法名(){} } 注意 {{}...
    99+
    2022-11-12
  • Python Pycurl的属性与方法案例详解
    Pycurl包是一个libcurl的Python接口,由C语言编写的,功能强大,速度快。由于pycurl的属性和方法太多了,写这篇博文记录一下pycurl的属性和方法。 正常安装 p...
    99+
    2022-11-12
  • Vue之监听方法案例详解
    vue中的监听方法 watch 注意 名字 你想监听哪个属性,就要和他起一样的名字 1.作用 用来监听vue实例中的数据变化 可以随时修改状态的变化 2.触发条件 当你监听的属性...
    99+
    2022-11-12
  • Java之Buffer属性案例详解
    一、前言 熟悉NIO的人想必一定不会陌生buffer中position,limit,capacity这三个属性吧,之前在学习的时候遇到一个问题:就是当你先往缓冲区写入一部分数据,然后...
    99+
    2022-11-12
  • CSS linear-gradient属性案例详解
    目录一、介绍二、使用技巧2.1 方格背景2.2 棋盘效果linear-gradient是css3的一个属性,功能强大,但是因为使用的灵活性,让没接触过的人感觉不好下手,下面来一起学习...
    99+
    2022-11-12
  • Vue之vue.$set()方法源码案例详解
    在使用vue开发项目的过程中,经常会遇到这样的问题:当vue的data里边声明或者已经赋值过的对象或者数组(数组里边的值是对象)时,向对象中添加新的属性,如果更新此属性的值,是不会更...
    99+
    2022-11-12
  • C# 控件属性和InitializeComponent()关系案例详解
    namespace Test22 { partial class Form1 { /// <summary> /// ...
    99+
    2022-11-12
  • Vue计算属性与监视属性实现方法详解
    目录一、计算属性1、插值语法实现2、通过方法实现3、通过计算属性二、监视属性三、深度监视一、计算属性 在开发中,可以有这样的需求,在属性(date)中,有fistName和lastN...
    99+
    2022-11-13
  • 关于Vue "__ob__:Observer"属性的解决方案详析
    目录问题描述原因分析:解决方案: 总结问题描述 我们操作 Vue 数据的时候,经常会看到这个属性: __ob__:Observer在我们操作这个数据的时候,如果想...
    99+
    2022-11-16
    vue __ob__:Observer属性 vue __ob__:Observer vue中_ob_:observer
  • Vue 计算属性之姓名案例的三种实现方法
    目录一、姓名案例-插值语法实现二、姓名案例-methods实现三、姓名案例-计算属性实现四、计算属性简写效果: 一、姓名案例-插值语法实现 <!DOCTYPE html>...
    99+
    2022-11-13
  • 详解jquery方法属性
    目录1.jquery简介2.jquery选择器2.1基本选择器5种2.2 关系选择器4种2.3基本过滤选择器8种2.4内容过滤选择器4种2.5可见性过滤选择器2种2.6属性过滤选择器...
    99+
    2022-11-12
  • Python内置方法和属性详解
    目录1.1 _del_方法(知道)1.2 _str_ 方法总结 1.1 _del_方法(知道) 在Python中 当使用 类名()创建对象时,为对象 分配完空间后,自动 调用 _i...
    99+
    2022-11-12
  • Vue3 全局实例上挂载属性方法案例讲解
    导语 在大多数开发需求中,我们有时需要将某个数据,或者某个函数方法,挂载到,全局实例身上,以便于,在项目全局的任何位置都能够调用其方法,或读取其数据。 在Vue2 中,我们是在 ma...
    99+
    2023-05-18
    Vue3挂载全局属性 Vue3Vue3全局实例挂载属性
  • Vueextends属性的用法示例详解
    目录引言App.vueSon.vueHelloWorld.vue小结引言 最近在看抖音——《小山与 bug》,看到一个很神奇的 Vue 继承组件的方法,后来...
    99+
    2022-11-13
  • Vue监听属性图文实例详解
    目录 什么是监听属性?监听属性和计算属性的区别?监听属性的使用深度监听立即调用写在最后 什么是监听属性? 所谓监听就是对内置对象的状态或者属性变化进行监听并且做出反应的响应,监听属性...
    99+
    2022-11-12
  • Java getParameter方法案例详解
    html核心代码 <body> <font size = "5" color ="blue">圆面积计算</font><br&...
    99+
    2022-11-12
  • Python rindex()方法案例详解
    描述 Python rindex() 方法返回子字符串最后一次出现在字符串中的索引位置,该方法与 rfind() 方法一样,只不过如果子字符串不在字符串中会报一个...
    99+
    2022-11-12
  • Java Collections.shuffle()方法案例详解
    Java.util.Collections类下有一个静态的shuffle()方法,如下: 1)static void shuffle(List<?> list) ...
    99+
    2022-11-12
  • C++ random_shuffle()方法案例详解
    假设你需要指定范围内的随机数,传统的方法是使用ANSI C的函数random(),然后格式化结果以便结果是落在指定的范围内。但是,使用这个方法至少有两个缺点。 首先,做格式化时,结果...
    99+
    2022-11-12
  • C# DateTime.Compare()方法案例详解
    C#中的DateTime.Compare()方法用于比较两个DateTime实例。它返回一个整数值, <0-如果date1早于date2 0-如果date1与...
    99+
    2022-11-12
软考高级职称资格查询
编程网,编程工程师的家园,是目前国内优秀的开源技术社区之一,形成了由开源软件库、代码分享、资讯、协作翻译、讨论区和博客等几大频道内容,为IT开发者提供了一个发现、使用、并交流开源技术的平台。
  • 官方手机版

  • 微信公众号

  • 商务合作