You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
49 lines
871 B
49 lines
871 B
2 years ago
|
<template>
|
||
|
|
<!-- 组件的模板标签 -->
|
||
|
|
<div class="demo">
|
||
|
|
<h2>学校名称：{{ schoolName }}</h2>
|
||
|
|
<h2>学校地址：{{ address }}</h2>
|
||
|
|
<button @click="showName">点我提示学校名</button>
|
||
|
|
</div>
|
||
|
|
</template>
|
||
|
|
|
||
|
|
<!-- 组件的交互标签 -->
|
||
|
|
<script>
|
||
|
|
export default {
|
||
|
|
name: 'School',
|
||
|
|
data() {
|
||
|
|
return {
|
||
|
|
schoolName: '尚硅谷',
|
||
|
|
address: '北京'
|
||
|
|
}
|
||
|
|
},
|
||
|
|
methods: {
|
||
|
|
showName() {
|
||
|
|
alert(this.schoolName)
|
||
|
|
}
|
||
|
|
}
|
||
|
|
}
|
||
|
|
|
||
|
|
// const school = Vue.extend({
|
||
|
|
// data() {
|
||
|
|
// return {
|
||
|
|
// schoolName: '尚硅谷',
|
||
|
|
// address: '北京'
|
||
|
|
// }
|
||
|
|
// },
|
||
|
|
// methods: {
|
||
|
|
// showName(){
|
||
|
|
// alert(this.schoolName)
|
||
|
|
// }
|
||
|
|
// }
|
||
|
|
// })
|
||
|
|
// 默认暴露
|
||
|
|
// export default school
|
||
|
|
</script>
|
||
|
|
|
||
|
|
<!-- 组件的样式标签 -->
|
||
|
|
<style>
|
||
|
|
.demo {
|
||
|
|
background-color: orange;
|
||
|
|
}
|
||
|
|
</style>
|