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. Git - git status - 查看当前仓库状态

    索引: 目录索引 参看代码 GitHub: git.txt 一.示例: git status 二.说明: 1."status" 部分 该命令可以查出当前分支文件变更状态, 可以查出 ...

  2. redis -list

    列表的元素类型为string 按照插入顺序排序 增加: 例如: 从列表的 左侧 加入数据 a b c lpush 键 a b c 显示:1“c"2"b"3"c& ...

  3. C#事件与委托详解

    from https://www.cnblogs.com/sjqq/p/6917497.html C#事件与委托详解[精华 多看看] Delegatedelegate是C#中的一种类型,它实际上是一个 ...

  4. Proverbs(谚语)

    Proverbs(谚语) 作者:凯鲁嘎吉 - 博客园 http://www.cnblogs.com/kailugaji/ 更多请查看:English 1. Every man is the maste ...

  5. 伺服电机&旋转变压器&光电编码器

    旋转变压器与光电编码器是目前伺服领域应用最广的测量传感器. 一.伺服系统 又称为随动系统,精确的跟随或者复现某个过程的反馈系统. 使物体的位置.方位.状态等输出被控量能够跟随目标(设定)的任意变化的自 ...

  6. ctrl+shift+r / ctrl+f5 强制（不使用缓存）刷新google chrome网页

    我改了csdn图片后, 一直看到的是旧图片, n天之后, 还是旧图片.猜测应该是用了缓存(且缓存更新逻辑失败, 定是csdn的bug), 用ctrl+shift+r, 或者ctrl+f5, 强制刷新页 ...

  7. day20 hashlib、hmac、subprocess、configparser模块

    hashlib模块:加密 import hashlib# 基本使用cipher = hashlib.md5('需要加密的数据的二进制形式'.encode('utf-8'))print(cipher.h ...

  8. Jdbc、Mybatis、Hibernate各自优缺点及区别

    文章出处:Jdbc,Mybatis,Hibernate各自优缺点及区别 先比较下jdbc编程和hibernate编程各自的优缺点. 1.JDBC 我们平时使用jdbc进行编程,大致需要下面几个步骤:  ...

  9. NodeJs连接操作MongoDB数据库

    NodeJs连接操作MongoDB数据库 一,介绍 MongoDB是一种文档导向数据库管理系统,由C++撰写而成.介绍如何使用 Node.js 来连接 MongoDB,并对数据库进行操作. Mongo ...

  10. webview 更新方法细节

    plus.webview.getWebviewById("user.home").evalJS("getHomeData()");//调用页面方法 plus.w ...