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>

效果如下

相关推荐
lhldsg21 小时前
家校托管互通系统开发实战:从需求分析到部署全指南
小程序·uni-app·需求分析
paopaokaka_luck1 天前
基于springboot3+vue3+uniapp的河南非遗数字图谱小程序(协同过滤算法、数字图谱展示、ECharts 图形化分析)
java·前端·spring boot·学习·小程序·uni-app·echarts
宠友信息2 天前
社区类源码开发实践中的仿小红书系统技术要点分析
java·spring boot·redis·mysql·uni-app·vue·内容运营
郑州光合科技余经理2 天前
本地生活平台搭建:统一订单表与多后台切换怎么拆
java·开发语言·前端·系统架构·uni-app·php·ai编程
lhldsg2 天前
树洞交友系统开发实战:从匿名社交需求到技术落地
java·小程序·uni-app·交友
lhldsg3 天前
家政派单系统开发实战:从需求分析到智能调度全流程指南
java·junit·小程序·uni-app·需求分析
PedroQue993 天前
v2.6.0 新增全局返回守卫与 iOS 侧滑拦截,补齐跨端路由拦截能力
前端·uni-app
蜡台3 天前
Uniapp 开发H5 页面跳转拦截
前端·javascript·uni-app
宠友信息4 天前
内容社区源码开发实践解析,用Spring Boot打造1:1仿小红书源码平台
java·spring boot·redis·websocket·mysql·spring·uni-app