插件,你也可以理解为就是一套方法的集合,当我们需要调用它的时候,引入一下就行了。
举个例子,比如说,swiper和elementui。
一般来说,我们每个项目都会安装一大堆的插件。用于处理各种交互效果和逻辑,但是,网上能搜到了插件不一定能解决我们所有的问题。也就是说,我们剩下30%左右的逻辑部分是需要自己处理的,比如说,转化时间,处理字符串等等。
这些东西网上是没有现成插件的,需要我们自己来写。此时,如果你每一个组件里面都去定义方法就显得太low了。
我们需要自己写一个插件,事半功倍!
一般来说,我们自己的js通常会写成下面的两种形式:
第一种,声明多个方法。这个做法也叫函数声明,这样做的好处是,声明到全局,你只要引用了它,在页面任意地方都可以使用。但是同样的缺点也很明显,容易引起全局污染,浪费浏览器资源。而且当我方法多的时候,调用起来很不方便。
第二种,这是我们最长使用的声明方式,函数表达式。目的就是加载了这个js以后,当我需要使用的时候,直接调用str.xxx(),就可以返回我需要的内容了。并且,方法封装在变量内部,不会引起全局污染,也符合模块化的规则。
ok,ok。我们接下来,就要把我们自己的方法定义到vue上去使用。
我首先把js放到了项目文件夹中,然后在main.js中引入。
调用起来是完全没有问题的。
但是,又好像哪里不太对?是的,这样我们仅仅是引入了一个js,并没有把它形成一个js的插件。
我们来看看一个标准的js插件的调用形式:
为什么他这个可以直接从this上面调用???
个人理解他的方法应该是被定义到全局的vue对象上面了,这里的this应该指的就是vue本身!
如果你看过龙哥前面的教程,你应该知道,当我们引入的插件,是一个对象的时候,应该使用:
use方法,可以把一个符合vue标准的对象加载到vue本体上。
首先给我们的main.js下面增加一行。
然后打开我们自己的js文件,按照下面的方式书写:
最后在页面中调用的时候:
到此我们的插件已经跟vue融为一体!其实插件本身还支持更多参数和写法,请各位同学自行研究吧!
亲爱的读者朋友,如果你点开了这篇文章,说明你对正则很感兴趣。
想必你也了解的重要性,在我看来正则表达式是衡量程序员水平的一个标准。
关于正则表达式的教程,网上也有很多,相信你也看了一些。
与之不同的是,本文的目的是希望所有认真读完的童鞋们,都有实质性的提高。
本文共有七章,用JavaScript语言完整地讨论了的方方面面。
如果觉得文章某块儿没有说明白清楚,欢迎留言,能力范围之内,老姚必做详细解答。
构造的方法和创建数学表达式的方法一样。也就是用多种元字符与运算符可以将小的表达式结合在一起来创建更大的表达式。正则表达式的组件可以是单个的字符、字符集合、字符范围、字符间的选择或者所有这些组件的任意组合。
正则表达式是由普通字符(例如字符 a 到 z)以及特殊字符(称为"元字符")组成的文字模式。模式描述在搜索文本时要匹配的一个或多个字符串。正则表达式作为一个模板,将某个字符模式与所搜索的字符串进行匹配。
https://unpkg.com/vue@2.5.3/dist/vue.js
来,直接开始:
创建一个 .html 文件,然后通过如下方式引入 Vue:
https://jsfiddle.net/chrisvfritz/50wL7mdz/
Vue.js 文档: https://cn.vuejs.org/v2/guide/
https://www.w3cplus.com/blog/vue
Vue 以数据驱动和组件化的思想构建的。相比于Angular.js,Vue.js提供了更加简洁、更易于理解的API,使得我们能够快速地上手并使用Vue.js。
如果你之前已经习惯了用jQuery操作DOM,学习Vue.js时请先抛开手动操作DOM的思维,因为Vue.js是数据驱动的,你无需手动操作DOM。它通过一些特殊的HTML语法,将DOM和数据绑定起来。一旦你创建了绑定,DOM将和数据保持同步,每当变更了数据,DOM也会相应地更新。
当然了,在使用Vue.js时,你也可以结合其他库一起使用,比如jQuery。