账号密码登录
微信安全登录
微信扫描二维码登录

登录后绑定QQ、微信即可实现信息互通

手机验证码登录
找回密码返回
邮箱找回 手机找回
注册账号返回
其他登录方式
分享
  • 收藏
    X
    vue小白,请问这个.vue文件中,template标签和导入的样式是如何起作用的?
    27
    0

    这个文件在一个用vue-cli生成的项目的组件文件夹下。
    template标签没有任何的标识符,比如id,我想请教vue是怎么知道要引用这个template标签里的模板呢?

    <template>
      <div class="main">
        <div class="logo">
          <h1>
            <img src="../../static/image/u9.jpg" alt="xxxx" class="logo-bd">
          </h1>
        </div>
        <div class="slogan">
          <img src="../../static/image/u27.png" alt="xxxx">
        </div>
        <p class="version">Ver 1. 0. 20180102.1</p>
      </div>
    </template>
    
    <script>
      import {mapState} from 'vuex';
      import {Methods} from '../const/common';
    
      export default {
        name: "start",
        computed: {
          ...mapState(['moduleState'])
        },
        mounted() {
          setTimeout(function () {
            this.moduleState.start = false
          }.bind(this), 2000);
        },
        beforeCreate() {
          Methods.getStoryList.call(this);
        }
      }
    </script>
    <style scoped>
      @import "../style/css/start.css";
    </style>
    
    0
    打赏
    收藏
    点击回答
        全部回答
    • 共 0 条
    • 潇洒的无所谓 普通会员 1楼

      在 Vue 中,<template> 标签用于定义组件的模板。模板是由 HTML 和 CSS 两部分组成的,HTML 是模板的语言,用来描述组件的内容;CSS 是模板的样式,用来描述组件的外观。

      模板的语法如下:

      ```html ```

      在这个例子中,<template> 标签定义了一个模板,它有一个内部的 <div> 标签。在这个 <div> 标签中,有两个 <p> 标签,它们分别用来显示 message 的内容。这个模板就是 my-component.vue 文件的模板。

      在 my-component.vue 文件中,我们首先导入了 Vue 的样式表,即 <style> 标签,然后定义了 message 的值,最后定义了这个模板的引用,即 <template> 标签。

      这样,当我们运行这个文件时,浏览器就会渲染这个模板,并将 message 的内容显示在页面上。

    更多回答
    扫一扫访问手机版
    • 回到顶部
    • 回到顶部