Student.vue 659 B

12345678910111213141516171819202122232425
  1. <template>
  2. <!-- 组件的结构 -->
  3. <div>
  4. <h2>学生姓名:{{name}}</h2>
  5. <h2>学生年龄:{{age}}</h2>
  6. <button @click="showName">点我提示学校名</button>
  7. </div>
  8. </template>
  9. <script>
  10. // 组件交互相关的代码(数据、方法等等)
  11. // export const school = Vue.extend({ //分别暴露
  12. export default {
  13. name:'Student', //组件名,最后与文件名保持一致
  14. data() {
  15. return {
  16. name: '张三',
  17. age: 18
  18. }
  19. }
  20. }
  21. // export {school} //统一暴露
  22. // export default school //默认暴露
  23. </script>