uni-app 预览并使用模板

一、预览

1.作者是使用Hbuilder X 编辑器

2.文件---新建---项目---uni-app---Hello uni-app

3.找到App.vue---运行---运行到小程序模拟器（就可预览uni-app自带的组件了）

二、使用

1.在第一步预览的时候看到了想要使用的组件（例如作者想要用---模板---滚动广告---竖向滚动）

2.在项目下面---page---template---scrollmsg

3.复制template代码

竖向滚动


	
		
	
	
		
			{{item}}
		
	

3.复制script代码

export default {
	data() {
		return {
			title:"滚动公告",
			msg : [
				'uni-app行业峰会频频亮相，开发者反响热烈',
				'DCloud完成B2轮融资，uni-app震撼发布',
				'36氪热文榜推荐、CSDN公号推荐 DCloud CEO文章'
			]
		}
	}
}

4.找到项目下面的App.vue，查看style代码，将以下代码中引入的uni.css在项目中找到，并将css复制到自己项目中去

 /* uni.css - 通用组件、模板样式库，可以当作一套ui库应用 */
    @import './common/uni.css';

注意：作者引用的这个css中，有一个uni.ttf的图片，所以也将图片复制到自己项目中去了，否则会报错，自己也可以通过看报错排查问题哦