vue.js如何实现点击按钮动态添加li
<!DOCTYPE html>
<html> <head>
<meta charset="UTF-8">
<title></title>
<script type="text/javascript" src="js/vue.js" ></script>
</head> <body>
<div id="todo-list-example">
<button v-on:click="ss">保存 </button>
<ul>
<li is="todo-item" v-for="(todo, index) in todos" v-text="sv" v-on:click="hh"></li>
</ul>
</div>
</body>
<script>
Vue.component('todo-item', {
template: `
<li v-on:click="$emit('click')">
{{ text }}
</li>`,
props: ['text']
})
new Vue({
el: '#todo-list-example',
data: {
todos: [
'+添加'
],
sv:'+添加'
},
methods: {
ss: function() {
this.todos.push(this.sv)
},
hh:function(){
alert(1)
}
}
})
</script> </html>
vue.js如何实现点击按钮动态添加li的更多相关文章
- js动态添加li,你添加的li具有你绑定的事件
2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 <%@page i ...
- jQuery动态添加li标签并添加属性和绑定事件
代码如下: <%@page import="java.util.ArrayList"%> <%@ page language="java" c ...
- 使用JS代码实现点击按钮下载文件
有时候我们在网页上需要增加一个下载按钮,让用户能够点击后下载页面上的资料,那么怎样才能实现功能呢?这里有两种方法: 现在需要在页面上添加一个下载按钮,点击按钮下载文件. 题外话,这个下载图标是引用的 ...
- CSS3和js炫酷点击按钮3D翻转动画特效
简要教程 flipside是一款使用CSS3和js制作的炫酷点击按钮无缝过渡到确认面板的过渡动画特效.该点击按钮特效在按钮不同方向的边部点击时,产生的过渡动画特效是不一样的. 在线预览 源码下载 ...
- js 实现页面点击按钮复制内容
前言: 我们平时在页面中是按照长按来实现复制相关的内容,那么怎么用js实现点击按钮实现复制相关的内容呢?请看如下方法: 实现步骤: 1.引入相关的js(ClipboardJS插件) <scrip ...
- js实现网页收藏功能，动态添加删除网址
<html> <head> <title> 动态添加删除网址 </title> <meta charset="utf-8"&g ...
- js遍历对象的属性并且动态添加属性
var person= { name: 'zhangsan', pass: '123' , 'sni.ni' : 'sss', hello:function (){ for(var i=0;i< ...
- vue.js 1.0中用v-for遍历出的li中的@click事件在移动端无效
在vue.js使用v-for遍历出的li中的@click事件在移动端无效,在网页端可以执行,代码如下 <template> <div class="rating-secti ...
- C# —— 点击按钮动态打开ComboBox
网上搜索了好多资料,大多是重绘ComboBox或者使用自定义控件创建一个全新的ComboBox(并非基于window的ComboBox). 对于菜鸟的我,实现太麻烦,有些代码理解起来困难,但是项目比较 ...
随机推荐
- Nvme固体硬盘Intel750,SM961分别使用一段时间以后对比
在SM961使用了一年半(2017年1月17日购买)后,再次测试,这次测试使用AS_SSD_Benchmark工具进行测试 感觉CrystalDiskMark工具测出来的分数在所以工具中分数最高 看图 ...
- POJ 1486 Sorting Slides（二分图完全匹配必须边）题解
题意:给你n张照片的范围,n个点的坐标,问你能唯一确定那几个点属于那几张照片,例如样例中4唯一属于A,2唯一属于C,1唯一属于B,3唯一属于C 思路:进行二分图完全匹配,怎么判断唯一属于?匹配完之后删 ...
- SPOJ 687 REPEATS - Repeats
题意 给定字符串,求重复次数最多的连续重复子串 思路 后缀数组的神题 让我对着题解想了快1天 首先考虑一个暴力,枚举循环串的长度l,然后再枚举每个点i,用i和i+l匹配,如果匹配长度是L,这个循环串就 ...
- jlink的SWD与JTAG下载模式的对应接线方法
参考博客:http://blog.csdn.net/qq_26093511/article/details/59484249 (1)如果用jtag模式下载的话需要接线: jlink ...
- Python实现机器学习算法：线性回归
import numpy as np from sklearn.datasets import load_diabetes from sklearn.utils import shuffle impo ...
- 【OData】使用Odata获取数据之后再次获取可能得不到最新的数据问题记录
工作上遇到个问题是关于系统后台数据库更新了某数据后, 前台界面刷新显示的不是最新的数据.但是大约10分后再次刷新就能显示新的数据,或者重启IIS等web server host. 最开始认为可能是因为 ...
- HTML-CSS-JS-JQ常用知识点总结
html:展示文件 标签:<html><head><title></title><meta><link><style> ...
- Python 爬起数据时 'gbk' codec can't encode character '\xa0' 的问题
1.被这个问题折腾了一上午终于解决了,再网上看到有用 string.replace(u'\xa0',u' ') 替换成空格的,方法试了没用. 后来发现 要在open的时候加utf-8才解决问题. 以 ...
- 【Selenium2】【Jenkins】
1. 下载Tomcat ,Windows7 环境,http://tomcat.apache.org/ 我下载的是版本8 2. 下载Jenkins,Windows7 环境,http://jenkins ...
- 因样式冲突引起的div消失问题
工作需要,搭建一个网站的模型,简单分成三个部分,标题栏,导航栏,主界面,效果如图: 但是点击界面的任意地方,中间的div块消失了,如图所示: 调试,发现在点击界面其他地方的时候display属性有变化 ...