为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报红, ...
随机推荐
- nginx常用场景
1.浏览器缓存 server { listen 8083; server_name 127.0.0.1; sendfile on; access_log /var/log/nginx/static_s ...
- dom4j创建和解析xml文档
DOM4J解析 特征: 1.JDOM的一种智能分支,它合并了许多超出基本XML文档表示的功能. 2.它使用接口和抽象基本类方法. 3.具有性能优异.灵活性好.功能强大和极端易用的特点. 4.是一个开 ...
- git 本地代码冲突解决,强制更新
git reset soft,hard,mixed之区别深解 git reset --hard 强制更新覆盖本地 GIT reset命令,似乎让人很迷惑,以至于误解,误用.但是事实上不应该如此难 ...
- Ubuntu 14.04 下使用微软的跨平台轻量级开发神器 Visual Studio Code
因为 Visual Studio Code 不断更新,官方最新 v1.32 的 .deb 包已经不能用于 Ubuntu 14.04 直接安装了. 下载 v1.31 的 deb 包安装即可:https: ...
- Angular CLI 升级 6.0 之后遇到的问题
Angular CLI 1.7.4 在使用 ng build --prod 会构建失败,而 ng build 是正常的.比较好的解决办法是使用 ng build --prod --extract-li ...
- 随心测试_职场面试_001<SX的面试观点>
快速理解_求职面试:必不可少的嘴 + 双向沟通交流 = 人与人之间的心理游戏 ps:以下为_面试题回答套路_案例,仅供参考,不挖坑 常见的面试题: 你是如何看待软件测试这个行业的? 说说你对软件测试 ...
- Django的ORM那些相关操作
一般操作 看专业的官网文档,做专业的程序员! 必知必会13条 <> all(): 查询所有结果 <> filter(**kwargs): 它包含了与所给筛选条件相匹配的对象 & ...
- pycharm .sqlite文件拖动到Database里面为空
pycharm .sqlite文件拖动到Database里面为空 查资料得到解决方法:
- MySQL主从复制(一)
whereis...命令的使用:
- servlet(1)
servlet类分级: 1.ServletConfig接口类:理解为读取servlet配置的类,里面有四个抽象方法如下: ①getServletName:获取servlet在web.xml中的名字 ② ...