1200字范文,内容丰富有趣,写作的好帮手!
1200字范文 > vue.js--基础事件定义 获取数据 执行方法传值

vue.js--基础事件定义 获取数据 执行方法传值

时间:2020-03-13 14:45:15

相关推荐

vue.js--基础事件定义 获取数据 执行方法传值

<template><div id="app"><h1>{{ msg }}</h1><br><button v-on:click="run1()"> 第一种写法</button><br><button @click='run2()'> 第二种写法</button><br><button @click='getMsg()'> 获取mesg</button><br><button @click='setMsg()'>更改mesg</button><br><button @click='addData()'>增加数据</button><ul><li v-for="item in list">{{item}}</li></ul><br><button @click="byvalue('values=1')">执行方法传值</button><br><button data-aid='123' @click="eventFn('$event')">事件对象</button></div></template><script>/*双向数据绑定,用于表单,*/export default {name: 'app',data () {return {msg: 'hello',list:[]}},methods:{run1(){alert("第一种方法")},run2(){alert("第二种方法")},getMsg(){alert(this.msg)},setMsg(){this.msg="改变内容"},addData(){for(var i=0;i<10;i++){this.list.push("我是第"+i+" 条数据");}},byvalue(env){ #进行传值alert(env)},eventFn(e){console.log(e);//e.srcElment.style.backgroud='red';}}}</script><style>h1, h2 {font-weight: normal;}.box{width: 100px;height: 100px;background-color: #42b983}</style>

本内容不代表本网观点和政治立场,如有侵犯你的权益请联系我们处理。
网友评论
网友评论仅供其表达个人看法,并不表明网站立场。