vuejs on
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>vue</title> <!--
<script src="vue.js"></script>
--> <script src="https://unpkg.com/vue/dist/vue.js"></script>
<script src="https://unpkg.com/lodash@4.13.1/lodash.min.js"></script>
</head>
<body> <div id="counter-event-example">
<p>{{ total }}</p>
<button-counter v-on:increment v-on:incrementTotal></button-counter>
<button-counter v-on:increment="incrementTotal"></button-counter>
</div> <script>
Vue.component('button-counter', {
template: '<button v-on:click="increment">{{ counter }}</button>',
data: function () {
return {
counter: 0
}
},
methods: {
increment: function () {
this.counter += 1
this.$emit('increment')
}
},
}) new Vue({
el: '#counter-event-example',
data: {
total: 0
},
methods: {
incrementTotal: function () {
this.total += 1
}
}
})
</script> </body>
</html>
vuejs on的更多相关文章
- TODO：搭建Laravel VueJS SemanticUI
TODO:搭建Laravel VueJS SemanticUI Laravel是一套简洁.优雅的PHP开发框架(PHP Web Framework).可以让你从面条一样杂乱的代码中解脱出来:它可以帮你 ...
- 一次页面从Jq到Vuejs+PartialView的迁徙
题外话 本篇分享不能帮助你入门vue,入门的文章也是无意义的,官方文档http://cn.vuejs.org/v2/guide/ 已经写的不能再清晰了.希望我们勇敢的主动地给自己创造实践的机会. 手里 ...
- 使用vuejs框架进行列表渲染
爱编程爱分享,原创文章,转载请注明出处,谢谢!http://www.cnblogs.com/fozero/p/6170706.html 1.通过Script引入Vuejs框架 <script t ...
- Vuejs学习笔记1
首次写vue可能会出现:[Vue warn]: Cannot find element: #app 这是因为你的js在html页面头部引入的原因,自定义js文件要最后引入,因为要先有元素id,vue才 ...
- 【vuejs小项目——vuejs2.0版本】单页面搭建
http://router.vuejs.org/zh-cn/essentials/nested-routes.html 使用嵌套路由开发,这里会出错主要把Vue.use(VueRouter);要进行引 ...
- 【vuejs小项目】一、脚手架搭建工作
一.关于vuejs 这是一个MVVM的前端开发框架,model(数据).viewmode(通讯).view(视图),它吸取了reactjs和angularjs的长处,核心重点在于组件化的设计原则. 我 ...
- vuejs的动态过滤
想要通过vuejs动态过滤(这里动态指得是过滤的条件是动态变化的), 一直没找到好办法, 最蠢的办法当然是两个两个数组,一个作为原始副本数组 一个作为视图数组,这样当过滤条件变化的时候 动态拷贝原始数 ...
- 使用 v-cloak 防止页面加载时出现 vuejs 的变量名
使用 vuejs 做了一个简单的功能页面,逻辑是,页面加载后获取当前的经纬度,然后通过 ajax 从后台拉取附近的小区列表.但是 bug 出现了,在显示小区列表之前,会闪现小区名对应的 vuejs 变 ...
- vuejs里封装的和IOS,Android通信模块
项目需要,在vuejs开发的web项目中与APP进行通信,实现原理和cordova一致.使用WebViewJavascriptBridge. 其实也是通过拦截url scheme,支持ios6往前的系 ...
- [Vuejs] 关于vue-router里面的subRoutes
刚学习vue,可能有使用不对的地方,希望没有对大家造成困扰! 使用vue-router,为了能够更好的管理.vue文件,需要用到子路由. 先看个错误的例子 routers.js '/company': ...
随机推荐
- Windows环境下通过Git来管理自己的Android代码
前面已经介绍了在Windows下使用git工具来下载Android的源代码,Windows环境下通过Git得到Android源代码,这里记录我使用git工具来管理我自己的代码,git是一种分布式的项目 ...
- react-route4 按需加载配置心得
本篇文章主要记录笔者项目中使用 react-route + webpack 做路由按需加载的心得,可能只有笔者一个人看,权当日记了. 很久很久以前,react-route还是2.X和3.X版本的时 ...
- validform
一.validform是什么? validform是一款智能的表单验证js插件,它是基于jQuery库与css,我们只需要把表单对象放入, 就可以对整个表 ...
- java算法数据结构
原文地址:github.com/kdn251/interviews 译文出自:掘金翻译计划 译者:王下邀月熊 校对者:PhxNirvana.根号三 这个 链接 用来查看本翻译与英文版是否有差别(如果你 ...
- Windows 10 10586 升级
- ing在写作中到底怎么用
改关静留的作业中我还得改英文摘要.于是有个地方用了ing.顺便查了一下. http://www.yygrammar.com/Article/201408/3677.html -ing分词用作状语时有九 ...
- ActiveMQ学习笔记（22）----ActiveMQ的优化和使用建议
1. 什么时候使用ActiveMQ 1. 异步通信 2. 一对多通信 3. 做个系统的集成,同构,异构 4. 作为RPC的替代 5. 多个应用相互解耦 6. 作为事件驱动架构的幕后支撑 7. 为了提高 ...
- H5教程：移动页面性能优化
随着移动互联网的发展,我们越发要关注移动页面的性能优化,今天跟大家谈谈这方面的事情. 首先,为什么要最移动页面进行优化? 纵观目前移动网络的现状,移动页面布局越来越复杂,效果越来越炫,直接导致了文件越 ...
- MFC基础知识
1.句柄:具有内存后,系统返回的标识符 2.消息:相当于事件,例如鼠标点击就是一个消息 3.消息队列:就是将事件按照时间的先后顺序在一个队列中 4.消息处理机制:首先操作系统拿到消息,然后将消息放到消 ...
- BZOJ 2938 [POI2000]病毒 (剪枝/A*迭代搜索)
LOJ BZOJ 题目大意:给你一些模式串,问是否存在一个无限长的文本串,不包含任何一个给定的模式串 并没有想到去模拟合法的文本串在模式串的Trie图上匹配的过程..我好菜啊 如果一个字符串合法,那么 ...