0

0

总结vue2.0 配置的实例方法

PHP中文网

PHP中文网

发布时间:2017-06-21 11:10:12

|

1750人浏览过

|

来源于php中文网

原创

全局配置

              silent        设置日志与警告
       optionMergeStrategies        合并策略
                devtools         配置是否允许vue-devtools
            errorHandler         错误追踪
            ignoredElements         忽略在Vue 之外的自定义元素。
                   keyCodes         自定义键位别名
           performance                        在浏览器中启用对组件初始化
             productionTip        启动时生成生产提示

 

立即学习前端免费学习笔记(深入)”;

全局API
         Vue.extend(options)             创建构造器,参数是一个选项对象
       Vue.nextTick([callback,context])             在下次更新DOM 更新循环之后执行延迟回调
                       Vue.set(object,key,value)             设置对象的属性
      Vue.delete(object,key)           删除对象的属性
                Vue.directive(id,[definition])          注册或获取全局指令
        Vue.filter(id,[definition])          注册或获取全局过滤器
           Vue.component(id,[definition])            注册或获取全局组件
          Vue.use(plugin)          安装Vue.js 插件
          Vue.mixin(mixin)          全局混合
          Vue.compile(template)            在render函数中编译模板字符串

 

立即学习前端免费学习笔记(深入)”;

选项/数据
             data               Vue           实例的数据对象
              props                          接收来自父组件的数据
             propsData             只用于new创建的实例中
              computed             计算属性
            methods           方法与事件处理
              watch           实例方法

 

立即学习前端免费学习笔记(深入)”;

选项/DOM
               el            DOM元素作为
           template              字符串模板
            render              字符串模板的替代方案

 

立即学习前端免费学习笔记(深入)”;

选项 /生命周期钩子

          beforeCreate           在实例初始化之后,数据观测和事件配置之前调用
                created           实例创建完成之后被调用
             beforeMount           在挂载开始之前被调用
             mounted            挂载到实例上之后再去调用钩子
            beforeUpdate            数据更新时调用
            updated             数据更新之后调用该钩子
             activated             组件激活时调用
            deactivated             组件停用时调用
             beforeDestroy                                       实例销毁之前调用
            destroyed                 Vue                                       实例销毁之后调用

 

立即学习前端免费学习笔记(深入)”;

选项 / 资源
           dirctives                  Vue               实例可用指令的的哈希表
             filters Vue               实例可用过滤器的哈希表
          components                  vues            实例可用组件的哈希表

 

立即学习前端免费学习笔记(深入)”;

选项/杂项
            parent               指定已创建的实例之父实例
              mixins                 选项接受一个混合对象的数组
                  name               允许组件模板递归的调用自身
               extends               允许声明扩展另一个组件
             delimiters             改变纯文本插入分隔符
            functional               是组建无状态和无实例

AI封面生成器
AI封面生成器

专业的AI封面生成工具,支持小红书、公众号、小说、红包、视频封面等多种类型,一键生成高质量封面图片。

下载

 

立即学习前端免费学习笔记(深入)”;

实例属性
          vm.$data                   Vue            实例观察的数据对象
            vm.$el                    Vue              实例使用的根DOM 元素
             vm.$options                用于当前Vue实例的初始化选项
              vm.$parent              父实例,如果当前实例有的话
                         vm.$root              当前组件树的根Vue实例
              vm.$children                当前实例的直接子组件
                           vm.$slots              用来访问被slot 分发的内容
          vm.$scopedSlots              用来访问scoped slots.
                      vm.$refs             一个对象,其中包含了所有拥有ref 注册的子组件
          vm.$isServer             当前Vue实例是否运行于服务器

 

立即学习前端免费学习笔记(深入)”;

实例方法/数据

     vm.$watch(expOrFn,callback,[options])         观察Vue 实例变化的一个表达式或计算属性
                         vm.$set(object,key,value)         这是全局Vue.set 的别名
             vm.$delete(object,key)         这是全局 Vue.delete 的别名

 

立即学习前端免费学习笔记(深入)”;

实例方法/事件
              vm.on(event,callback)         监听当前实例上的自定义事件
           vm.$once(event,callback)           监听一个自定义事件,但只触发一次
                            vm.$off([event,callback])           移除事件监听器
             vm.$emit(event,[...args])         触发实例上的事件

 

立即学习前端免费学习笔记(深入)”;

指令
                  v-text           更新元素的文本内容
                   v-html            更新元素的innerHTML
                    v-show            根据表达式之真假值,切换元素display css属性。
                     v-if               根据表达式的真假条件渲染元素
                   v-else            为v-if 或者v-else-if 添加else块。
                   v-for            基于源数据多次渲染元素活模板块
                   v-on             缩写@,绑定事件监听器,事件类型由参数指定。
                   v-bind             缩写 : 动态的绑定一个或多个特性
                   v-model             在表单控件或者组件上创建双向数据绑定
                  v-pre             跳过这个元素和它的子元素的编译过程
                  v-cloak             这个指令保持在元素上直到关联实例编译结束
                  v-once             只渲染元素和组件一次

 

立即学习前端免费学习笔记(深入)”;

特殊属性
              key            主要用于vue的虚拟DOM 算法
               ref            被用来给元素或子组件注册引用信息
                slot             用于标记往哪个slot中插入子组件的内容

 

立即学习前端免费学习笔记(深入)”;

内置 的组件
          component            渲染一个元素为动态组件
            transition             元素作为单个元素或组件的过度效果
         transition-group             元素作为多个元素/组件的过度效果
            keep-alive              主要用于保留组件状态或者避免重复渲染
              slot             元素作为组件模板之中的内容分发槽

热门AI工具

更多
DeepSeek
DeepSeek

幻方量化公司旗下的开源大模型平台

豆包大模型
豆包大模型

字节跳动自主研发的一系列大型语言模型

通义千问
通义千问

阿里巴巴推出的全能AI助手

腾讯元宝
腾讯元宝

腾讯混元平台推出的AI助手

文心一言
文心一言

文心一言是百度开发的AI聊天机器人,通过对话可以生成各种形式的内容。

讯飞写作
讯飞写作

基于讯飞星火大模型的AI写作工具,可以快速生成新闻稿件、品宣文案、工作总结、心得体会等各种文文稿

即梦AI
即梦AI

一站式AI创作平台,免费AI图片和视频生成。

ChatGPT
ChatGPT

最最强大的AI聊天机器人程序,ChatGPT不单是聊天机器人,还能进行撰写邮件、视频脚本、文案、翻译、代码等任务。

相关专题

更多
Python 序列化
Python 序列化

本专题整合了python序列化、反序列化相关内容,阅读专题下面的文章了解更多详细内容。

0

2026.02.02

AO3官网入口与中文阅读设置 AO3网页版使用与访问
AO3官网入口与中文阅读设置 AO3网页版使用与访问

本专题围绕 Archive of Our Own(AO3)官网入口展开,系统整理 AO3 最新可用官网地址、网页版访问方式、正确打开链接的方法,并详细讲解 AO3 中文界面设置、阅读语言切换及基础使用流程,帮助用户稳定访问 AO3 官网,高效完成中文阅读与作品浏览。

91

2026.02.02

主流快递单号查询入口 实时物流进度一站式追踪专题
主流快递单号查询入口 实时物流进度一站式追踪专题

本专题聚合极兔快递、京东快递、中通快递、圆通快递、韵达快递等主流物流平台的单号查询与运单追踪内容,重点解决单号查询、手机号查物流、官网入口直达、包裹进度实时追踪等高频问题,帮助用户快速获取最新物流状态,提升查件效率与使用体验。

27

2026.02.02

Golang WebAssembly(WASM)开发入门
Golang WebAssembly(WASM)开发入门

本专题系统讲解 Golang 在 WebAssembly(WASM)开发中的实践方法,涵盖 WASM 基础原理、Go 编译到 WASM 的流程、与 JavaScript 的交互方式、性能与体积优化,以及典型应用场景(如前端计算、跨平台模块)。帮助开发者掌握 Go 在新一代 Web 技术栈中的应用能力。

11

2026.02.02

PHP Swoole 高性能服务开发
PHP Swoole 高性能服务开发

本专题聚焦 PHP Swoole 扩展在高性能服务端开发中的应用,系统讲解协程模型、异步IO、TCP/HTTP/WebSocket服务器、进程与任务管理、常驻内存架构设计。通过实战案例,帮助开发者掌握 使用 PHP 构建高并发、低延迟服务端应用的工程化能力。

5

2026.02.02

Java JNI 与本地代码交互实战
Java JNI 与本地代码交互实战

本专题系统讲解 Java 通过 JNI 调用 C/C++ 本地代码的核心机制,涵盖 JNI 基本原理、数据类型映射、内存管理、异常处理、性能优化策略以及典型应用场景(如高性能计算、底层库封装)。通过实战示例,帮助开发者掌握 Java 与本地代码混合开发的完整流程。

5

2026.02.02

go语言 注释编码
go语言 注释编码

本专题整合了go语言注释、注释规范等等内容,阅读专题下面的文章了解更多详细内容。

62

2026.01.31

go语言 math包
go语言 math包

本专题整合了go语言math包相关内容,阅读专题下面的文章了解更多详细内容。

55

2026.01.31

go语言输入函数
go语言输入函数

本专题整合了go语言输入相关教程内容,阅读专题下面的文章了解更多详细内容。

27

2026.01.31

热门下载

更多
网站特效
/
网站源码
/
网站素材
/
前端模板

精品课程

更多
相关推荐
/
热门推荐
/
最新课程
玩转 Vue3.0 新特性
玩转 Vue3.0 新特性

共19课时 | 1.8万人学习

Vue3.0 极速入门教程
Vue3.0 极速入门教程

共55课时 | 5.6万人学习

VUE2.0+VUE3.0从入门到精通(完整版)
VUE2.0+VUE3.0从入门到精通(完整版)

共142课时 | 25.1万人学习

关于我们 免责申明 举报中心 意见反馈 讲师合作 广告合作 最新更新
php中文网:公益在线php培训,帮助PHP学习者快速成长!
关注服务号 技术交流群
PHP中文网订阅号
每天精选资源文章推送

Copyright 2014-2026 https://www.php.cn/ All Rights Reserved | php.cn | 湘ICP备2023035733号