Vue.js学习（2）-Vue目录结构

原创于 2018-09-04 13:46:30 发布 · 429 阅读

0 ·

CC 4.0 BY-SA版权

VUE/Angular/Node 专栏收录该内容

39 篇文章

订阅专栏

本文介绍了一个Vue.js的基本组件HelloWorld的实现方式，包括其模板、业务逻辑和样式部分。通过具体的代码示例展示了如何定义一个Vue组件，并设置初始数据来显示定制化的欢迎信息。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

1.目录文件结构说明

*.vue 组件文件：template:页面渲染 script业务逻辑 style 样式

2.修改初始化文件，查看效果

F:\test\vuedemo\src\components\HelloWorld.vue

<template>
  <div class ="hello">
    <h1>
      {{msg}}
    </h1>
  </div>
</template>
<script>
  export default {
    name:"hello",
    data(){
      return {
        msg:"欢迎 sunny 进入本站学习Vue.js!"
      }
    }
  }
</script>