版权声明：本文为博主原创文章，未经博主允许不得转载。 https://blog.csdn.net/phone13144830339/article/details/82935448
<html>
<head>
<title>HelloWorld</title>
<script src="../vue.js"></script>
</head>
<body>
<div id='demo-content'>
<div>{{ HelloWorld }}</div>
<!--
v-on:click.stop
v-on:click.prevent
v-on:click.capture
v-on:click.self
v-on:click.once
v-on:click.passive
-->
<button v-on:click="setHelloWorld('漂亮的你')">You're Beautiful</button>
<span v-if="success">成功</span>
<span v-else-if="!success">失败></span>
<form v-on:submit="newsSearch()">
<!--v-on:keyup.alt
v-on:keyup.enter-->
<input v-bind:type="type" v-bind:value="HelloWorld" v-on:keyup=""/>
<input type="submit" value="搜索"/>
</form>
<ul><li v-for="val in subject">
编号：{{val.id}}
，名称：{{val.name}}
</li></ul>
</div>
<script>
var vm = new Vue({
el: '#demo-content',
data: {
HelloWorld: '你好世界！',
type: 'search',
success: true,
subject: [{
id:1,name:"语文"
},{
id:2,name:"数学"
},{
id:3,name:"英语"
}]
},
methods: {
setHelloWorld: function(val) {
this.HelloWorld = val;
},
newsSearch() {
alert(this.HelloWorld);
}
},
computed: {
}
});
</script>
</body>
</html>