uni-app 今天也要努力写项目NO.1

引入字体图标

首先在网页上下载自己需要的图标
网址如下：https://www.aigei.com/icon/class/film_8/?detailTab=file
然后将下载的图标放进static位置里
在文件papes.json里写入代码

"tabBar":{"color":"#000000",//字体默认颜色"selectedColor":"#aa55ff",//字体点击后颜色"backgroundColor":"#ffffff",//背景颜色"position":"bottom",// 标签位置"borderStyle":"black",// 上边框颜色"list":[{"pagePath":"pages/index/index",//链接指向位置"text":"首页",//图标下方字迹"iconPath":"static/z/jia.png",//点击前图标"selectedIconPath":"static/z/jiahong.png"//点击后图标},{"pagePath":"pages/hengping/index","text":"横屏","iconPath":"static/z/heng.png","selectedIconPath":"static/z/hengpinghong.png"},{"pagePath":"pages/search/index","text":"搜索","iconPath":"static/z/sousuo.png","selectedIconPath":"static/z/sousuohong.png"},{"pagePath":"pages/video/index","text":"视频","iconPath":"static/z/shipin.png","selectedIconPath":"static/z/shipinhong.png"},{"pagePath":"pages/mine/index","text":"我的","iconPath":"static/z/mine.png","selectedIconPath":"static/z/minehong.png"}]}

成品如下

引入字体图标
字体图标使用的是 iconfont
在app.vue中全局引入

<style>@import url("./styles/iconfont.wxss");
</style>

我敲…敲不下去了，下次再说。这个课程张嘴一说把文件引入进去，没给文件，这么长！

三：uni-ui
uni-ui介绍
uni-ui时DCloud提供的一个跨端ui库，它是基于vue组件的，flex布局的，无dom的跨全端ui框架
uni-ui不包括基础组件，他是基础组件的补充
数字角标、日历、卡片、折叠面板、倒计时、抽屉、悬浮按钮、底部购物导航、宫格、图标、索引列表、列表、加载更多、自定义导航、通告栏、数字输入框、分页器、弹出层、评分、搜索栏、分段器、步骤条、滑动操作、轮播图指示点、标签、

uni-ui的使用
安装uni-ui
局部引入组件
注册组件
使用组件
https://ext.dcloud.net.cn/plugin?id=55组件安装库
登录之后点击第二个NPM链接，就会有使用方法，但是我点不开截屏吧

4.uni-api
原生的微信小程序的api不支持promise
uni-app对大部分的小程序的原生api做了封装，使之支持promise
使用方式
0.1原生微信小程序微wx.request
0.2uni-api的方式uni-request
0.3其他api的使用方式也类似

onLoad() {uni.request({url:"https://www.dcloud.io/"}).then(res=>{console.log(res);})},

uni-app 今天也要努力写项目NO.1相关推荐

uni app中使用图表
关于在uni app中运用图表今天写项目,需要在uni app中使用图表,我使用的是ucharts. 具体操作如下 1.下载 ucharts可以直接在uni app的插件市场下载安装. 先在插件市场 ...
HBuilder X ——Uni app 学习笔记（一）
HBuilder X --Uni app 学习笔记(一) 1.pages.json配置 *pages数组中第一项表示应用启动页,数组中其他项为项目中所有页面路径. enablePullDownRefr ...
uni app(H5)中软键盘弹出,固定定位绝对定位元素位置发生错乱
一.问题如下最近用uni app写项目,发现H5软键盘弹起,导致我固定定位的按钮被顶了上去,如图二.解决方法 1.让其在输入框获取焦点时隐藏百度了许多,有让输入框获取焦点时让按钮隐藏的方法,失去 ...
uni app 开发微信小程序及上线体验
uni app 开发微信小程序及上线体验项目创建及微信小程序AppId的申请本次开发的是电商类的微信小程序,这里用到的是HBuilderX这个编辑器.之前用的Visual Studio Code ...
切换 uniapp_万能前端框架uni app初探03：底部导航开发
前言本节我们使用uni app的底部导航功能,点击不同tab会显示不同页面,这个功能在实际项目开发中几乎是必备的. 一.基础知识 1.tabBar 如果应用是一个多 tab 应用,可以通过 tabB ...
【十万个编程篇】写文章与“写项目”的差别
自古暨今,世间陆续诞生出"现象级"的文学作品,如<左传>.<桃花源记>.<背影>等文章,又如<咏鹅>.<将进酒>.< ...
uni.app H5(微信公众号定位) uni.getLocation
最近在开发公众号,由于之前经常使用uni,app写APP,索性就用uni.app来开发公众号了, 不过也遇到了一个问题,就是在公众号的首页要获取用户的定位.我看了看官网的API 有个uni.getLo ...
HbuilderX:uni app踩坑之uView-ui
HbuilderX:uni app踩坑之uView-ui 最近在自学uniapp,想找一个ui框架提高一下学习和开发的效率,于是就网上冲浪,浪来浪去,最后选择了uView-ui这款.其实有些框架我是有 ...
uni app 手机端导航栏自定义
uni app 手机端导航栏自定义第一步:明确顶部导航栏的构成(手机自带的顶部菜单+开发的顶部菜单栏) 获取手机自带的顶部导航栏 <view class="navigation_ba ...

uni-app 今天也要努力写项目NO.1

uni-app 今天也要努力写项目NO.1相关推荐

最新文章

热门文章