vue----动态组件（将component放在app容器内）

最新推荐文章于 2024-06-21 11:09:47 发布

咩有猫腻.

最新推荐文章于 2024-06-21 11:09:47 发布

阅读量723

点赞数

分类专栏：三-框架类 Vue

本文链接：https://blog.csdn.net/DcTbnk/article/details/107248781

版权

三-框架类同时被 2 个专栏收录

83 篇文章 0 订阅

订阅专栏

Vue

31 篇文章 0 订阅

订阅专栏

在这里插入图片描述

<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>component</title>
  </head>
  <body>
    <div id="app">
      <button>按钮</button>
      <!-- component此处表示一个节点 有一个属性叫is，is表示当前组件内容 显示的是哪一个-->
      <!-- <component is="d"></component>  会报错 自己不会正确显示，但是也不会影响别人 -->
      <component is="demo"></component>
      <component is="k"></component>
    </div>
    <script src="./libs/vue.js"></script>
    <script>
      var d = {
        template: "<h1>我是一个demo组件</h1>",
      };
      var k = {
        template: "<h1>我是一个k组件</h1>",
      };
      new Vue({
        el: "#app",
        components: {
          demo: d,
          k,
        },
      });
    </script>
  </body>
</html>

确定要放弃本次机会？

福利倒计时

: :

立减 ¥

普通VIP年卡可用

立即使用

咩有猫腻.

关注关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
vue----动态组件（将component放在app容器内）

<!DOCTYPE html><html lang="en"> <head> <meta charset="UTF-8" /> <meta name="viewport" content="width=device-width, initial-scale=1.0" /> <title>component</title> </head> <body> &.
复制链接

扫一扫