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. LEDE 虚拟机安装

    虽然我对路由器没什么兴趣,但是紧跟潮流还是有必要的,现在因为网络闭关锁国政策,很多人都想自己搭配一台私人的服务器,不想被商业公司左右数据安全.我感觉这个是一个商机,建议大家可以朝这个方向发展. 这里最 ...

  2. python datetime操作

    #datetime object转化为timestamp import datetime now = datetime.datetime.now() now_timestamp = time.mkti ...

  3. 搭建 structs2 环境

    前言 环境: window 10 ,JDK 1.8 ,Tomcat 7 ,MyEclipse 2014 pro 搭建 SSH 环境的步骤 创建 JavaWeb 项目 导入 structs2 的jar包 ...

  4. python之定义类创建实例

    https://www.cnblogs.com/evablogs/p/6688938.html 类的定义 在Python中,类通过class关键字定义,类名以大写字母开头 1 2 >>&g ...

  5. mysql解压包安装教程

    1.下载压缩包,地址1(官网下载):https://www.mysql.com/downloads/   地址2(百度网盘):https://pan.baidu.com/s/12lnpcr3thBe9 ...

  6. “尝试加载 Oracle 客户端库时引发 BadImageFormatException。如果在安装 32 位 Oracle 客户端组件的情况下以 64 位模式运行，将出现此问题。”

    远程连接服务器的数据库调试WCF程序时,可以正常访问数据库,但将程序发布成站点部署在数据库所在的服务器之后,一直报错,通过try/catch捕获得到以下报错信息: System.Exception: ...

  7. C++一些基本数据结构：字面常量、符号常量、枚举常量

    常量:C++包括两种常量,字面常量和符号常量. 字面常量:指的是直接输入到程序中的值 比如:in myAge=26: myAge是一个int类型变量,而26是一个字面常量. 符号常量:指的是用名称表示 ...

  8. shell脚本监控

    监控磁盘空间 vim check_disk.sh #!/bin/bash # test common. #warn=$ #err=$ #mount=$ check_val() { /usr/bin/e ...

  9. 关于使用nodejs的mysql查询时碰到的坑

    今天在编写登录模块时,碰到一个隐蔽的坑,故记录一番 在使用Node.js的mysql模块的query方法时,查询语句使用了 `select password from login where name ...

  10. day12（表达式，推导式，名称空间与作用域，函数的嵌套定义）

    一,复习 # 字符串的比较 # -- 按照从左往右比较每一个字符,通过字符对应的ascll进行比较 # print('a' > 'A') #True # print('ac' > 'ab' ...