common.js

var common =function() {
return{
f1:function(){
console.log("this is common f1().");
},
f2:function(){
console.log(" out vist f222222().");
},
// 小写转大写
toUppercase:function(o,parName){
if(o && o[parName]){
o[parName] = o[parName].toUpperCase();
}
}
}}();
if(typeof(Vue)=="function")Vue.prototype.common=common;

html页

<html>
<head>
<meta charset="UTF-8">
<script src="https://vuejs.org/js/vue.min.js"></script>
<script src="common.js"></script>
</head>
<body>
<div id="app">
<br>username:<input type="text" @keyup="common.toUppercase(v1,'username')" v-model="username" >
{{username}}
<br>userobj:<input type="text" @keyup="common.toUppercase(userobj,'usernameEN')" v-model="userobj.usernameEN" >
</div> </body>
</html>
<script>
var v1=new Vue({
el: '#app',
data: {
username:"",
userobj:{usernameEN:""}
},
created:function(){
this.common.f1();
}
,methods:{
testf2:function(){
//this.common.f2();
}
}
}) //在vue外面也可以调用
common.f1();
common.f2();
</script>

为vue添加公用方法,vue添加通用方法的更多相关文章

  1. orm 通用方法——GetOneModel 条件查询一个对象

    数据连接层的方法封装成通用方法是很有必要,节省不必要的重复写代码. Golang的orm.xorm框架没有封装这些操作. 这里是一个查询单个对象的方法. 此处抛砖引玉,大家继续完善. 通用方法定义代码 ...

  2. onscroll事件没有响应的原因以及vue.js中添加onscroll事件监听的方法

    1 onscroll事件失效 <!DOCTYPE html> <html> <head> <meta charset="utf-8"> ...

  3. vue实现购物清单列表添加删除

    vue实现购物清单列表添加删除 一.总结 一句话总结: 基础的v-model操作,以及数组的添加(push)删除(splice)操作 1.checkbox可以绑定数组,也可以直接绑定值? 绑定数组就是 ...

  4. js添加事件通用方法

    <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title> ...

  5. vue 点击当前元素添加class 去掉兄弟的class 获取当前点击元素的文字

    点击当前标签给其添加class,兄弟标签class删除 然后获取当前点击元素的文字 演示地址: https://xibushijie.github.io/static/addClass.html &l ...

  6. vue 点击当前元素添加class 去掉兄弟的class

    <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <meta http ...

  7. vue不同序号的元素添加不同的样式

    vue不同序号的元素添加不同的样式 一.总结 一句话总结: 在vue中设计一个样式的数据数组来遍历即可 <script> new Vue({ el:'#review_exam_part', ...

  8. vue 实现todolist,包含添加,删除,统计,清空,隐藏功能

    vue 实现todolist,包含添加,删除,统计,清空,隐藏功能 添加:生成列表结构(v-for+数组).获取用户输入(v-model).通过回车新增数据(v-on+.enter) 删除:点击删除指 ...

  9. vue封装公用弹出框方法,实现点击出现操作弹出框

    vue封装公用弹出框方法,实现点击出现操作弹出框 如上图所示,这次要实现一个点击出现操作弹框的效果:并将这个功能封装成一个函数,便于在项目的多个地方使用. 具体思路是: 封装一个组件,组件保护一个插槽 ...

  10. vue + iview 怎样在vue项目下添加ESLint

    参考:https://segmentfault.com/a/1190000012019019?utm_source=tag-newest 使用iview框架的MenuGroup标签,vscode报红, ...

随机推荐

  1. nginx常用场景

    1.浏览器缓存 server { listen 8083; server_name 127.0.0.1; sendfile on; access_log /var/log/nginx/static_s ...

  2. dom4j创建和解析xml文档

    DOM4J解析  特征: 1.JDOM的一种智能分支,它合并了许多超出基本XML文档表示的功能. 2.它使用接口和抽象基本类方法. 3.具有性能优异.灵活性好.功能强大和极端易用的特点. 4.是一个开 ...

  3. git 本地代码冲突解决,强制更新

    git reset soft,hard,mixed之区别深解 git reset --hard  强制更新覆盖本地   GIT reset命令,似乎让人很迷惑,以至于误解,误用.但是事实上不应该如此难 ...

  4. Ubuntu 14.04 下使用微软的跨平台轻量级开发神器 Visual Studio Code

    因为 Visual Studio Code 不断更新,官方最新 v1.32 的 .deb 包已经不能用于 Ubuntu 14.04 直接安装了. 下载 v1.31 的 deb 包安装即可:https: ...

  5. Angular CLI 升级 6.0 之后遇到的问题

    Angular CLI 1.7.4 在使用 ng build --prod 会构建失败,而 ng build 是正常的.比较好的解决办法是使用 ng build --prod --extract-li ...

  6. 随心测试_职场面试_001<SX的面试观点>

    快速理解_求职面试:必不可少的嘴 +  双向沟通交流 = 人与人之间的心理游戏 ps:以下为_面试题回答套路_案例,仅供参考,不挖坑 常见的面试题: 你是如何看待软件测试这个行业的? 说说你对软件测试 ...

  7. Django的ORM那些相关操作

    一般操作 看专业的官网文档,做专业的程序员! 必知必会13条 <> all(): 查询所有结果 <> filter(**kwargs): 它包含了与所给筛选条件相匹配的对象 & ...

  8. pycharm .sqlite文件拖动到Database里面为空

    pycharm .sqlite文件拖动到Database里面为空 查资料得到解决方法:

  9. MySQL主从复制(一)

    whereis...命令的使用:

  10. servlet(1)

    servlet类分级: 1.ServletConfig接口类:理解为读取servlet配置的类,里面有四个抽象方法如下: ①getServletName:获取servlet在web.xml中的名字 ② ...