为vue添加公用方法,vue添加通用方法
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添加通用方法的更多相关文章
- orm 通用方法——GetOneModel 条件查询一个对象
数据连接层的方法封装成通用方法是很有必要,节省不必要的重复写代码. Golang的orm.xorm框架没有封装这些操作. 这里是一个查询单个对象的方法. 此处抛砖引玉,大家继续完善. 通用方法定义代码 ...
- onscroll事件没有响应的原因以及vue.js中添加onscroll事件监听的方法
1 onscroll事件失效 <!DOCTYPE html> <html> <head> <meta charset="utf-8"> ...
- vue实现购物清单列表添加删除
vue实现购物清单列表添加删除 一.总结 一句话总结: 基础的v-model操作,以及数组的添加(push)删除(splice)操作 1.checkbox可以绑定数组,也可以直接绑定值? 绑定数组就是 ...
- js添加事件通用方法
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title> ...
- vue 点击当前元素添加class 去掉兄弟的class 获取当前点击元素的文字
点击当前标签给其添加class,兄弟标签class删除 然后获取当前点击元素的文字 演示地址: https://xibushijie.github.io/static/addClass.html &l ...
- vue 点击当前元素添加class 去掉兄弟的class
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <meta http ...
- vue不同序号的元素添加不同的样式
vue不同序号的元素添加不同的样式 一.总结 一句话总结: 在vue中设计一个样式的数据数组来遍历即可 <script> new Vue({ el:'#review_exam_part', ...
- vue 实现todolist,包含添加,删除,统计,清空,隐藏功能
vue 实现todolist,包含添加,删除,统计,清空,隐藏功能 添加:生成列表结构(v-for+数组).获取用户输入(v-model).通过回车新增数据(v-on+.enter) 删除:点击删除指 ...
- vue封装公用弹出框方法,实现点击出现操作弹出框
vue封装公用弹出框方法,实现点击出现操作弹出框 如上图所示,这次要实现一个点击出现操作弹框的效果:并将这个功能封装成一个函数,便于在项目的多个地方使用. 具体思路是: 封装一个组件,组件保护一个插槽 ...
- vue + iview 怎样在vue项目下添加ESLint
参考:https://segmentfault.com/a/1190000012019019?utm_source=tag-newest 使用iview框架的MenuGroup标签,vscode报红, ...
随机推荐
- JMeter 接口测试-if控制器
JMeter 接口测试-if控制器 使用场景: 当业务场景是用户登录才能支付操作, 不登录点击支付, 页面会跳转到登录页面. 对于接口也是这样, 一个接口需要执行前, 需要有前提条件, 比如0状态 ...
- rocketmq简单消息发送
有以下3种方式发送RocketMQ消息 可靠同步发送 reliable synchronous 可靠异步发送 reliable asynchronous 单向发送 one-way transmissi ...
- 商米D1S一体机设置搜狗手写输入法图解
按照下图步骤,一步步设置即可,询问全新的时候需要点击允许. 商米应用市场搜索下载搜狗输入法,并安装 安装完成后,点击桌面搜狗输入法,选择启用搜狗输入法,如图 点击启用后,在虚拟键盘中选择搜狗输入法,并 ...
- Python--day14(迭代器)
今日主要内容 1. 带参装饰器 (了了解) 2. 迭代器(*****) 可迭代对象 迭代器对象 for迭代器 枚举对象 1. 带参装饰器 1. 通常,装饰器为被装饰的函数添加新功能,需要外界的 ...
- 11 Django REST Framework 针对基于类的视图添加 @csrf_exempt
01-在类的 dispatch 方法上使用 @csrf_exempt from django.views.decorators.csrf import csrf_exempt class MyView ...
- An interesting combinational problem
A question of details in the solution at the end of this post of the question is asked by me at MSE. ...
- Android中自定义IP控件
最近在搞Android项目,之前并没有系统的去学过这方面的编程,只能边看书边撸代码.在项目的开发的过程中,需要一个IP控件,后面了解到Android中并没有这样的控件,于是网上搜索,发现得到的结果并不 ...
- 服务端返回的json数据,导致前端报错的原因及解决方法
前言 最近在开发的过程中遇到了一个问题:后端传过来的json字符串不是标准的json字符串 导致报错的原因 后端传过来的json字符串中包含一些不标准的字符或错误的引号嵌套 1)\n 2) \r 3) ...
- syntax error near unexpected token `$'\r''
这种情况发生的原因是因为你所处理的文件换行符是dos格式的"\r\n"可以使用cat -v 文件名 来查看换行符是否是,如果是上述的,则行结尾会是^m需要转换成linux/unix ...
- 资源预加载preload和资源预读取prefetch简明学习
前面的话 基于VUE的前端小站改造成SSR服务器端渲染后,HTML文档会自动使用preload和prefetch来预加载所需资源,本文将详细介绍preload和prefetch的使用 资源优先级 在介 ...