1. html 页面代码
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
</head>
<body>
<div id="app">
<div>
名字<input type="text" v-model="name">
<span v-show="name">你的名字是: {{name}}</span>
</div>
<div>
年龄<input type="text" v-model="age">
<span v-show="age">你的年龄是: {{age}}</span>
</div>
<div>
性别<input type="text" v-model="sex">
<span v-show="sex" >你的性别是: {{sex}}</span>
</div>
</div>
<script src="../lib/vue.js"></script>
<script src="js/01.js"></script>
</body>
</html>
2. js 代码
var app = new Vue({
el: '#app' , //作用在id为app 的组件
data: {
name: null,
age: null,
sex: null
}
});
3. 效果图
欢迎来到这里！
我们正在构建一个小众社区，大家在这里相互信任，以平等 • 自由 • 奔放的价值观进行分享交流。最终，希望大家能够找到与自己志同道合的伙伴，共同成长。
注册 关于