uniapp 新建组件

1. 新建文件夹 components

文件夹名称必须是 components ,否则组件无法自动导入

2. 新建组件


3. 编辑组件

components/logo/logo.vue

html 复制代码
<template>
	<img src="https://img.alicdn.com/imgextra/i1/O1CN01EI93PS1xWbnJ87dXX_!!6000000006451-2-tps-150-150.png" />
</template>

4. 使用组件

因 uniapp 会自动导入 components 文件夹中的组件,所以直接在页面中使用即可

pages/index/index.vue

html 复制代码
<logo></logo>

效果如下

相关推荐
耶啵奶膘3 小时前
uniapp+vue2解构赋值和直接赋值的优缺点
uni-app
疯狂的沙粒3 小时前
uni-app 项目支持 vue 3.0 详解及版本升级方案?
前端·vue.js·uni-app
Jiaberrr3 小时前
uniapp Vue2 获取电量的独家方法:绕过官方插件限制
前端·javascript·uni-app·plus·电量
^Rocky5 小时前
uniapp 对接腾讯云IM群公告功能
uni-app·腾讯云
段旭涛5 小时前
uniapp 设置手机不息屏
前端·uni-app
疯狂的沙粒7 小时前
在web-view 加载的本地及远程HTML中调用uniapp的API及网页和vue页面是如何通讯的?
前端·uni-app·html
狼性书生19 小时前
uniapp实现的简约美观的星级评分组件
前端·uni-app·vue·组件
Jiaberrr1 天前
uniapp 安卓 APP 后台持续运行(保活)的尝试办法
android·前端·javascript·uni-app·app·保活
不老刘1 天前
uniapp+vue3实现CK通信协议(基于jjc-tcpTools)
前端·javascript·uni-app
疯狂的沙粒1 天前
uni-app 如何实现选择和上传非图像、视频文件?
前端·javascript·uni-app