uni-app组件使用基础与教程，简单易学

梦里梦外; 2021-08-26 21:40 269阅读 0赞

全局组件设置  
main.js

// 常用组件，全局注册
    import tsBad from 'components/teaset/components/ts-badge.vue';
    
    // 全局注册
    Vue.component("ts-bad",tsBad)
    
    <ts-bad></ts-bad>

局部组件设置  
vue文件下

<script>
    	// 组件局部注册
    	import tsBann from "components/teaset/components/ts-banner.vue"
    	export default {
    		components:{
    			tsBann
    		},
    		data() {
    			return {
    				title: 'index',
    				list: []
    			}
    		},
    		onLoad() {
    
    		},
    		methods: {
    
    		}
    	}
    </script>

在对应的vue文件下注册之后可在该vue下直接使用，例：

<ts-bann></ts-bann>

## ❤️ 只求一赞 ##

如果文章对你有帮助，轻轻地点个赞，不留下一丝云彩，只留下你的脚步~  
文章首发于个人原创公众号：「达达前端」，囊括前端Vue、JavaScript、数据结构与算法、实战演练、Node全栈一线技术，紧跟业界发展步伐，一个热爱前端的达达程序员。

> 【作者】：Jeskson  
> 【原创公众号】：达达前端  
> 【福利】：公众号回复 “资料” 送自学资料大礼包（进群分享，想要啥就说哈，看我有没有）！  
> 【转载说明】：转载请说明出处，谢谢合作！~

### 欢迎关注[达达前端][Link 1]的CSDN！ ###

![前端技术栈][format_png]

[Link 1]: https://blog.csdn.net/qq_36232611
[format_png]: /images/20210724/441139b6762647b49a0b180e6d5e2c07.png

发表评论取消回复

表情：

评论列表（有 0 条评论，269人围观）

还没有评论，来说两句吧...

相关阅读

相关 ColorUI-UniApp组件库使用笔记

uniapp里面的一个UI组件库 https://ext.dcloud.net.cn/plugin?id=239 这是一款适应于H5、微信小程序、安卓、ios、支付宝的高

心已赠人/ 2023年02月13日 11:18/ 0 赞/ 34 阅读

相关 uniapp的map组件

uni-app 地图使用的是腾讯地图注：中间不能有多个并列，不然编译不通过。 vue模板只能有一个根目录 <template> <view>

刺骨的言语ヽ痛彻心扉/ 2022年12月08日 05:37/ 0 赞/ 569 阅读

相关使用阿里云发送短信验证码教程（简单易学）

> 使用阿里云发送短信验证码准备工作：注册阿里云账号购买阿里云短信服务设置短信模板，添加短信签名 1. 添加aliyun-sdk-code依赖

小灰灰/ 2022年11月25日 13:21/ 0 赞/ 395 阅读

相关 uniapp loading 组件

> 组件：loading.vue <template> <view> <view class="cu-load load-modal" v-if

「爱情、让人受尽委屈。」/ 2021年09月19日 16:36/ 0 赞/ 1009 阅读

相关 uniapp组件汇总

1. [Card卡片][Card] 2. [uni-swiper-dot轮播图指示点][uni-swiper-dot] 3. [Section章节标题][Section]

「爱情、让人受尽委屈。」/ 2021年09月07日 06:13/ 0 赞/ 792 阅读

相关 uni-app组件使用基础与教程，简单易学

全局组件设置 main.js // 常用组件，全局注册 import tsBad from 'components/teaset/components/t

梦里梦外;/ 2021年08月26日 21:40/ 0 赞/ 270 阅读

相关 uniapp——text组件的基本使用

![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ub

刺骨的言语ヽ痛彻心扉/ 2021年07月26日 00:29/ 0 赞/ 898 阅读

相关 uniapp组件-button按钮

效果图： ![watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV

川长思鸟来/ 2021年07月25日 14:27/ 0 赞/ 1685 阅读

相关 uniapp——view组件的基本使用

![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ub

待我称王封你为后i/ 2021年07月25日 13:16/ 0 赞/ 893 阅读

相关 uniapp——image组件的基本使用

![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ub

深藏阁楼爱情的钟/ 2021年07月25日 11:59/ 0 赞/ 1108 阅读