文章详情

短信预约-IT技能 免费直播动态提醒

请输入下面的图形验证码

提交验证

短信预约提醒成功

vuejs是不是API

2024-04-02 19:55

关注

这篇文章主要介绍了vuejs是不是API,具有一定借鉴价值,感兴趣的朋友可以参考下,希望大家阅读完这篇文章之后大有收获,下面让小编带着大家一起了解一下。

vuejs不是API。vuejs是一套用于构建用户界面的渐进式JavaScript框架,旨在更好地组织与简化Web开发。而API是指应用程序编程接口,是一些预先定义的函数,目的是提供应用程序与开发人员基于某软件或硬件得以访问一组例程的能力。

本教程操作环境:windows7系统、vue2.9.6版,DELL G3电脑。

vuejs不是API。

Vue (读音 /vjuː/,类似于 view) 是一套用于构建用户界面的渐进式JavaScript框架,旨在更好地组织与简化Web开发。 与其它大型框架不同的是,Vue 被设计为可以自底向上逐层应用。

Vue 的核心库只关注视图层,不仅易于上手,还便于与第三方库或既有项目整合。另一方面,当与现代化的工具链以及各种支持类库结合使用时,Vue 也完全能够为复杂的单页应用(SPA)提供驱动。

Vue.js 还提供了 MVVM 数据绑定和一个可组合的组件系统,具有简单、灵活的 API,其目标是通过尽可能简单的 API 实现响应式的数据绑定和可组合的视图组件。

API(Application Programming Interface,应用程序编程接口)是一些预先定义的函数,目的是提供应用程序与开发人员基于某软件或硬件得以访问一组例程的能力,而又无需访问源码,或理解内部工作机制的细节。

vuejs中的一些API

vm指new Vue获取的实例

(1)当dom标签里的值和data里的值绑定后,更改data对应的值可以实时更新标签里的值;

但后续添加的值是无效的(绑定失败)。

(2)将可以将对象直接作为data的一个属性,是有效的(因为对象按值传递);

所以该属性和该对象是全等的;

(3)vm的接口有:

vm.$data是vm的data属性;

vm.$el是el属性指向的dom结点;

vm.$watch是监视属性变化(比如data里的值)(参照(九))

(4)vue实例的声明周期,有几个关键函数:

created:事件绑定结束后,函数直接在声明vue实例的时候,作为vue实例中的一个属性,下同。

vm.$mount:挂载dom结点;

beforeCompile:加载模板之前;

compiled:加载模板之后;

ready:完成之后(我猜的);

beforeDestroy:摧毁之前;

destroyed:摧毁之后;

(5)vm.$mount(挂载的id或者类名)

在new Vue实例的时候,不加el,则表示不挂载只生成,生成之后,可以通过该方法来手动挂载到某个地方,如果符合条件的有多个,则挂载到第一个地方;

(6)v-for遍历数组、对象,可以创建多个标签;比如用于创建表格;

(7)转义:{{}} 两个大括号,不会转义值的html标签;

{{{}}}  三个大括号,会将值的html标签转义,即变为html文本;

不能在值内再放入绑定数据(除非使用partials,但我还不会);

(8)在插值的大括号内,可以放入表达式(不能放函数);

(9)在插值的大括号内,加入管道符|,可以使用过滤器;

capitalize就是将首字母大写的过滤器;

过滤器只能放在表达式最后,不能成为表达式的一部分;

过滤器可以加参数;

过滤器可以自定义(但目前还不知道自定义的方法);

(10)指令:

v-if=”变量名”           当某个值为true时存在;

v-bind:属性名=”变量名”             将等号后的变量名(指向vm的data属性里的同名属性),和该标签的html属性绑定在一起。

v-on:事件类型=”函数名”            触发事件类型时,执行methods里的函数;

v-on的缩写是@;v-bind的缩写是:(冒号);

(11)计算属性computed

这里的属性,可以当做data属性里的使用;优点是data里的数值变更时,这里会跟着一起改变;

可以使用更复杂的表达式(插值里只能使用简单的表达式);

(12)计算属性的setter和getter

默认是getter(对象的get属性),即当某个值改变时,触发回调函数(或get方法);

当计算属性改变时,需要改变某些值(比如改变10个值,在其他地方写监听这个值就不好),那么则需要设置setter(对象的set属性),即当计算属性改变时,触发set方法;

(13)监视属性vm.$watch(被监视的属性, 回调函数)

监视的是data属性;

回调函数的第一个参数是改变后的值,第二个参数是改变前的值;

属性的值改变时触发;

(14)class绑定:

用v-bind:class

class使用对象形式,key为class类名,值表示是否显示这个class类;

可以直接将一个object对象放置在v-bind:class的值中,并将这个对象放置在data属性中,这样设置这个object对象的属性即可;

class的数组写法:数组里的成员为变量名,如果该变量不是object对象,则变量的值为类名;如果是对象时,对象的key是类名,值表示是否显示;

(15)style绑定:

用v-bind:style

形式是一个对象,对象的key是样式名(如fontSize,注意样式名需要采用驼峰式而不是css式),值是样式的值;

可以直接将对象名放在v-bind:style的等式右边;

对象的值改变,将实时影响内联样式;

对于某些样式,可以针对浏览器加前缀(但某些不能对所有浏览器兼容);

感谢你能够认真阅读完这篇文章,希望小编分享的“vuejs是不是API”这篇文章对大家有帮助,同时也希望大家多多支持编程网,关注编程网行业资讯频道,更多相关知识等着你来学习!

阅读原文内容投诉

免责声明:

① 本站未注明“稿件来源”的信息均来自网络整理。其文字、图片和音视频稿件的所属权归原作者所有。本站收集整理出于非商业性的教育和科研之目的,并不意味着本站赞同其观点或证实其内容的真实性。仅作为临时的测试数据,供内部测试之用。本站并未授权任何人以任何方式主动获取本站任何信息。

② 本站未注明“稿件来源”的临时测试数据将在测试完成后最终做删除处理。有问题或投稿请发送至: 邮箱/279061341@qq.com QQ/279061341

软考中级精品资料免费领

  • 历年真题答案解析
  • 备考技巧名师总结
  • 高频考点精准押题
  • 2024年上半年信息系统项目管理师第二批次真题及答案解析(完整版)

    难度     807人已做
    查看
  • 【考后总结】2024年5月26日信息系统项目管理师第2批次考情分析

    难度     351人已做
    查看
  • 【考后总结】2024年5月25日信息系统项目管理师第1批次考情分析

    难度     314人已做
    查看
  • 2024年上半年软考高项第一、二批次真题考点汇总(完整版)

    难度     433人已做
    查看
  • 2024年上半年系统架构设计师考试综合知识真题

    难度     221人已做
    查看

相关文章

发现更多好内容

猜你喜欢

AI推送时光机
位置:首页-资讯-前端开发
咦!没有更多了?去看看其它编程学习网 内容吧
首页课程
资料下载
问答资讯