注册全局组件(H5) 任意页面使用
在view下创建components文件夹。
在components下创建文件夹base.
base文件夹是用来存放 基础组件的。
比如说页面中很多处都在使用的公共组件
如你需要自定义的按钮
在components下新建index.js
用来导出你自定义的组件
这样在任意页面就可以使用组件了
index.js和base同级的
base下的search.vue组件
<template>
<div class="test">
<h1>我是一个组件</h1>
<div>我这个组件可以全局使用的</div>
</div>
</template>
<script>
export default {
data() {
return {
}
}
}
</script>
<style lang="scss" scoped>
.test {
background: pink;
padding: 10px;
text-align: center;
}
</style>
在components下新建index.js
import com from "./base/search.vue";
export default (Vue) => {
Vue.component("com", com);
};
==========
另外一种
function aa(Vue) {
Vue.component("com", com);
}
export default aa;
在main.js中挂载
import com from "./components";
Vue.use(com);
在XXX.vue直接使用
<template>
<div>
<com></com>
</div>
</template>

注册全局组件(H5) 任意页面使用的更多相关文章
- vue 中注册全局组件
1 全局注册组件 建一个 js 文件, 注册全局组件, 并且暴露出去 然后再在 main.js 中引入 在页面就可以直接使用了 2 全局注册过滤器 建立文件, 包含所有过滤器方法 ...
- vue 注册全局组件
注册全局组件有啥好处呢? 提高代码的复用性:哪里需要写哪里,贼方便,就写一个标签:减少代码量:可以再配合slot一起使用,咦~~,舒服 为了让整个项目的可读性,我创建一个文件统一存放全局组件 1.创建 ...
- vue 自动注册全局组件
vue 自动注册全局组件 vue 注册全局组件的方式 const plugins = { install(Vue) { const requireComponent = require.context ...
- Vue 注册全局组件的方式
一.语法:Vue的实例.component("组件名称",组件) 1.方式一:这个组件就是 vue文件 import { createApp,h } from 'vue' //引入 ...
- vue 复习篇. 注册全局组件,和 组件库
初篇 ============================================================== 1. 编写loading组件(components/Loading/ ...
- VUE注册全局组件和局部组件
全局组件 第一步:在components文件夹下建立一个子文件Users.vue <template> <div class="users"> {{msg} ...
- vue注册全局组件
在项目开发中能不能自己写一个组件可以像iview或者element那样可以不必引用就可以直接用呢?答案是可以的. 首先,写一个组件mainHeader. 接着在vue中注册这个组件,代码如下: Vue ...
- Vue3注册全局组件
1. Vue3全局组件注册 components文件夹下新建index.js文件,统一引入需要注册的组件 import CustomCheck from "./CustomCheck.vue ...
- Webpack+vue2.0如何注册全局组件 (01)
Part 1, 问题: webpack + vue2.0框架中,如何在入口js中注册组件? 就是在一个月以前,匆匆闯入vuejs这个社群,基本了解了vuejs的一些基础特性和语法.笔者兴致勃勃地开始想 ...
- Vue自动化注册全局组件脚本
今天有一个idea,vue一些组件,可能会全局都用到,我觉得在main.js写 Vue.component(name, instance) 然后很命令式,写着也不好看,想着能够有一个函数可以指定加载比 ...
随机推荐
- atcoder ABC237-E Skiing
atcoder ABC237-E Skiing 传送门 这题把一个点到另外一个点的开心值变为这条边的权值,就可以化为求最大路.因为有负边权,所以要用\(SPFA\),但\(SPFA\)这玄学的时间复杂 ...
- nginx配置php-fpm虚拟主机站点
ubuntu下安装nginx 很简单 sudo apt-get install nginx 然后安装php-fpm 我这本地php7.4所以这么写 sudo apt search php7.4-fpm ...
- 超聚变服务器2288H V6使用 iBMC 安装 Ubuntu Server 24.04 LTS及后续系统配置
一. 超聚变服务器iBMC远程管理 超聚变服务器的iBMC芯片集成了一个专用的管理GE网口,提供全面的故障诊断.自动化运维.硬件安全加固等管理特性.iBMC支持Redfish.SNMP.IPMI 2. ...
- Python网络爬虫第一弹
03.Python网络爬虫第一弹<Python网络爬虫相关基础概念> 爬虫介绍 引入 之前在授课过程中,好多同学都问过我这样的一个问题:为什么要学习爬虫,学习爬虫能够为我们以后的发展带来那 ...
- elementUI中的级联选择器,默认赋值不起作用
今天遇到再使用element的级联选择器功能的时候,是多选,默认赋值不起作用. 后来查到是因为少了multiple属性,但是multiple属性要放在props绑定的对象中,而不是直接放在标签上 &l ...
- 内网穿透之frp
官网文档:https://gofrp.org 1 Frp介绍frp 是一个开源.简洁易用.高性能的内网穿透和反向代理软件,支持 tcp, udp, http, https等协议.frp 项目官网是 h ...
- qiankun 的 CSS 沙箱隔离机制
为什么需要CSS沙箱 在 qiankun 微前端框架中,由于每个子应用的开发和部署都是独立的,将主/子应用的资源整合到一起时,容易出现样式冲突的问题 因此,需要 CSS 沙箱来解决样式冲突问题,实现主 ...
- GIT 使用SSH 方式提交代码
1.需求 一般情况下,我们在提交代码的时候,使用 HTTP的方式提交代码,这种方式有一个问题,提交时需要输入账号和密码,这个就不是很安全,git 提供了 SSH的方式. 下面就实际操作一下如何使用ss ...
- CentOS 更换国内源
前言 centos默认为官方yum源,国内使用的下载速度完全随缘,且不稳定,一般都需要更换国内源 过程 了解版本 通过cat /etc/redhat-release 可以获取当前centos的版本 知 ...
- cnpm : 无法加载文件 cnpm.ps1
两种方法,本人用的第二种有效 一 安装 cnpm 命令行 npm install -g cnpm --registry=https://registry.npm.taobao.org 在使用 powe ...