
uniapp
文章平均质量分 56
if.else.Z
Nothing is too difficult if you put your heart into it
展开
-
uniapp中使用iconfont多色图标
1、iconfont下载图标2、安装iconfont-toolsnpm install -g iconfont-tools3、powershell执行命令1. 以管理员身份运行PowerShell2. 执行:get-ExecutionPolicy,收到Restricted,表示状态是禁止的3.执行:set-ExecutionPolicy RemoteSigned4.选择Y注意:一定要以管理员的身份运行PowerShell,不是cmd窗口!4、引用&l原创 2021-05-17 15:15:09 · 779 阅读 · 0 评论 -
uni-app 学习笔记
html标签和uni-app内置组件的映射表:div 改成view span、font 改成text a 改成navigator img 改成image input仅仅是输入框。 原html规范中input不仅是输入框,还有radio、checkbox、时间、日期、文件选择功能。在uni-app和小程序规范中,input仅仅是输入框。其他功能uni-app有单独的组件或API:radio组件、checkbox组件、时间选择、日期选择、图片选择、视频选择、多媒体文件选择(含图片视频)、通...原创 2021-03-23 18:43:43 · 3559 阅读 · 1 评论 -
uni-app 组件
规范所有组件与属性名都是小写,单词之间以连字符-连接。 根节点为<template>,这个<template>下只能且必须有一个根<view>组件 共同属性类型:id、class、style、hidden、data-*、@* 基础组件分为八大类:视图容器:view、scroll-view 、swiper 基础内容:icon、text 、rich-text、progress 表单组件:button、form、input、checkbox、ridio...原创 2021-03-23 18:43:19 · 1615 阅读 · 0 评论 -
uniapp-【progress】
属性名 类型 默认值 说明 平台差异说明 percent Float 无 百分比0~100 show-info Boolean false 在进度条右侧显示百分比 border-radius number/string 0 圆角大小 app-nvue、微信基础库2.3.1+、QQ小程序 font-size number/string 16 右侧百分比字体大小 app..原创 2021-03-23 17:20:01 · 587 阅读 · 0 评论 -
uniapp-【rich-text】
rich-text 组件内屏蔽所有节点的事件。所以如果内容中有链接、图片需要点击,则不能使用rich-text,此时可在uni-app插件市场搜索parse插件使用。app-nvue的rich-text组件支持链接图片点击 name 属性大小写不敏感 img 标签仅支持网络图片 如果在自定义组件中使用 rich-text 组件,那么仅自定义组件的 css 样式对 rich-text 中的 class 生效。nodes 属性推荐使用 Array 类型,由于组件会将 String 类型转换为 Array原创 2021-03-23 17:14:25 · 4268 阅读 · 2 评论 -
uniapp-【text】
在app-nvue下,只有<text>才能包裹文本内容。无法在<view>组件包裹文本decode 可以解析的有 <>&'  <text>组件内只支持嵌套<text>支持\n方式换行如果使用<span>组件编译时会被转换为<text>除了文本节点以外的其他节点都无法长按选中...原创 2021-03-23 17:05:13 · 569 阅读 · 0 评论 -
uniapp-【icon】
属性名 类型 默认值 说明 type String icon的类型 size Number 23 icon的大小,单位px color Color icon的颜色,同css的color <view class="item" v-for="(value,index) in iconType" :key="index"> <icon :type="value" size="26"/&...原创 2021-03-23 17:00:29 · 429 阅读 · 0 评论 -
uniapp-组件规范
easycom、uni_module、datacom、原生组件、uniCloud组件 easycom: 只要组件安装在项目的components目录下或uni_modules目录下,并符合components/组件名称/组件名称.vue目录结构。就可以不用引用、注册,直接在页面中使用。 不管components目录下安装了多少组件,easycom打包后会自动剔除没有使用的组件,对组件库的使用尤为友好 easycom是自动开启的,不需要手动开启 在组件名完全一致的情况下,easycom引入的优原创 2021-03-23 16:57:16 · 2656 阅读 · 0 评论 -
uniapp-【cover-view】【cover-image】
属性名 类型 默认值 说明 平台差异说明 scroll-top number/string 设置顶部滚动偏移量,仅在设置了 overflow-y: scroll 成为滚动元素后生效 微信小程序2.1.0原创 2021-03-23 12:35:10 · 1581 阅读 · 0 评论 -
uniapp-【movable-area】【movable-view】
movable-area指代可拖动的范围,在其中内嵌movable-view组件用于指示可拖动的区域 即手指/鼠标按住movable-view拖动或双指缩放,但拖不出movable-area规定的范围 movable-view必须在movable-area组件中,并且必须是直接子节点,否则不能移动 movable-view 必须设置width和height属性,不设置默认为10px movable-view 默认为绝对定位,top和left属性为0px 当movable-view小于movable原创 2021-03-22 17:16:26 · 5756 阅读 · 2 评论 -
uniapp-【match-media】
例如在match-media组件中放置一个侧边栏,媒体查询规则设置为宽屏才显示,就可以实现在PC宽屏显示该侧边栏,而在手机窄屏中不显示侧边栏的效果属性名 类型 默认值 必填 说明 min-width number 否 页面最小宽度( px 为单位) max-width number 否 页面最大宽度( px 为单位) width number 否 页面宽度( px 为单位) min...原创 2021-03-22 16:05:21 · 1049 阅读 · 3 评论 -
uniapp-【swiper】
属性名 类型 默认值 说明 平台差异说明 indicator-dots Boolean false 是否显示面板指示点 indicator-color Color rgba(0, 0, 0, .3) 指示点颜色 indicator-active-color Color #000000 当前选中的指示点颜色 autoplay Boolean false 是否自动切换 ...原创 2021-03-22 15:25:33 · 854 阅读 · 0 评论 -
uniapp-【scroll-view】
属性名 类型 默认值 说明 scroll-x Boolean false 允许横向滚动 scroll-y Boolean false 允许纵向滚动 upper-threshold Number 50 距顶部/左边多远时(单位px),触发 scrolltoupper 事件 lower-threshold Number 50 距底部/右边多远时(单位px),触发 scrolltolower 事件 scr原创 2021-03-19 11:54:53 · 2327 阅读 · 0 评论 -
uniapp-【view】
<view class="uni-flex uni-row"> <view class="flex-item">A</view> <view class="flex-item">B</view> <view class="flex-item">C</view></view>.flex-item {width: 33.3%;}<view class="uni-flex uni-...原创 2021-03-19 11:37:06 · 1270 阅读 · 0 评论 -
uniapp 引用 vant weapp 使用usingcomponents方式
"usingComponents": { "van-button": "/wxcomponents/vant/button/index", "van-cell": "/wxcomponents/vant/cell/index", "van-cell-group": "/wxcomponents/vant/cell-group/index", "van-icon": "/wxcomponents/vant/icon/index", "van-image": "/wxcompo.原创 2021-01-07 16:42:17 · 4284 阅读 · 1 评论 -
uniapp+vant weapp 引用所有组件后报错
报错:[Vue warn]: Do not use built-in or reserved HTML elements as component id: header原因:"van-calendar": "/wxcomponents/vant/calendar/index"vue 组件名称(name 属性) 与 HTML5 标签名称冲突,注意 vue 组件命名不要与已有标签一致即可解决:将calendar中header组件改为vanheader...原创 2021-01-07 16:39:28 · 660 阅读 · 3 评论 -
HbuilderX 调用 微信开发者工具报错
设置->安全设置->服务端口要打开原创 2020-12-24 21:47:26 · 530 阅读 · 0 评论 -
uniapp 使用 vant-weapp 编译微信小程序报错
1、问题:uniapp 使用 vant-weapp运行在chrome中完全没问题,但是运行到小程序就编译报错,原因是因为不能用easycom方式引用组件,要用usingComponents的方式报错:Module Error (from ./node_modules/@dcloudio/vue-cli-plugin-uni/packages/vue-loader/lib/loaders/templateLoader.js):(Emitted value instead of an instanc.原创 2020-12-24 21:29:17 · 4388 阅读 · 0 评论 -
uniapp中引用vant weapp 使用easycom
1、通过npm install 方式引入 npm i @vant/weapp -S --production"easycom": { "autoscan": true, "custom": { "van-(.*)": "@/node_modules/@vant/weapp/dist/$1/index.vue" }}2、通过复制黏贴到wxcomponents方式引入"easycom": { "autoscan": true, "custom":.原创 2020-12-24 11:24:20 · 2696 阅读 · 4 评论 -
uniapp结合vant weapp使用,编译时报错
1、问题描述:uniapp结合vant weapp使用,编译时报错:(36:193) Unclosed bracket解决方式:dist/icon/index.wxss 和 icon/index.vue 中的url前面要加空格2、问题描述:uniapp结合vant weapp使用,编译时报错:TypeError: Cannot read property 'split' of undefined解决方式:dist/common/version.js 中return compareVersio原创 2020-12-24 11:13:30 · 1024 阅读 · 4 评论 -
uni-app学习入门-生命周期
目录应用生命周期页面生命周期组件生命周期应用生命周期函数名 说明 onLaunch 当uni-app初始化完成时触发(全局只触发一次) onShow 当uni-app启动,或从后台进入前台显示 onHide 当uni-app从前台进入后台 onError 当uni-app报错时触发 onUniNViewMessage 对nvue页面发送的数据进行监听 onUnhandledRejection 对未处理的 ...原创 2020-12-09 16:55:43 · 231 阅读 · 0 评论 -
uni-app学习入门-框架总结
pages.json 全局配置,页面路由、窗口样式、原生导航栏、底部原生tabbar 配置项globalStyle:默认页面窗口表现 pages:设置页面路径及窗口表现 easycom:组件自动引入规则 tabBar:设置底部tab表现 condition:启动模式配置 subPackages:分包加载配置 preloadRule:分包预下载规则 --小程序 workers:worker代码放置目录--小程序 leftWindow:大屏左侧窗口--H5 to...原创 2020-12-09 16:30:10 · 1100 阅读 · 0 评论