精华内容
下载资源
问答
  • vant-weapp

    2019-08-26 14:58:17
    微信小程序快速入手,有框架可用 https://youzan.github.io/vant-weapp/#/quickstart

    微信小程序快速入手,有框架可用
    https://youzan.github.io/vant-weapp/#/quickstart

    展开全文
  • 2 用cmd或者powershell找到该项目目录,在该目录下进行安装vant-weapp 步骤一 通过 npm 安装 # 通过 npm 安装 npm i @vant/weapp -S --production # 通过 yarn 安装 yarn add @vant/weapp --production # 安装 0.x ...
  • vant-weapp.rar

    2019-11-29 17:44:21
    直接在对应需要用的组件的json文件引入相应的组件。 例如: { "usingComponents": { "van-popup": "/pages/vant-weapp/popup/index" }, "navigationBarTitleText": "成为会员" }
  • vant-weapp.zip

    2019-11-22 17:31:07
    小程序使用vant-weapp框架确实便捷,但是官方生成的wxss文件单位都是px,和我们平时的rpx存在一些适配兼容问题,文件是 px转成rpx后的文件。
  • 轻量,可靠的小程序UI组件库 :fire: :rainbow: :rocket: 介绍 Vant是有赞前端团队开源的移动端组件库,于2017年开源,已持续维护4年时间。...npm i vant-weapp -S --production 方式二。下载代码 直接通过git下载Va
  • 微信小程序项目使用npm安装vant-weapp的正确步骤  使用npm安装vant-weapp 到项目根目录下: npm i vant-weapp -S --production 然后再详情中选中使用npm模块,然后点击工具栏中的构建npm。本以为这样就可以安装...
  • vant-weapp非常好用,但是我们查看所有组件的样式文件的单位基本都是px 而不是我们期待的rpx (因为这个原因差点放弃这个UI框架)小程序使用vant-weapp(px已转rpx)
  • vant-weapp官网打不开

    千次阅读 多人点赞 2020-08-04 16:52:55
    是否有小伙伴跟小编一样,突然发现 vant-weapp进不去了 后来在码云上找到了一个国内的版本:https://vant-contrib.gitee.io/vant/#/zh-CN/home 但是用的时候发现 属性有些许差异: 应该是版本不一致导致的...

    是否有小伙伴跟小编一样,突然发现 vant-weapp进不去了

    后来在码云上找到了一个国内的版本:https://vant-contrib.gitee.io/vant/#/zh-CN/home

    但是用的时候发现 属性有些许差异:

    应该是版本不一致导致的。

     

    但是这不能忍啊!!!后来找了很多方式,最终如下方式能生效

    step1:前往“站长工具”查询youzan.github.io的DNS

    站长工具路径:http://tool.chinaz.com/dns?type=1&host=youzan.github.io&ip=

    step2:找到TTL值最小的那个的ip地址 和 vant-weapp的网址对应关系,配置到hosts文件中

    win10 hosts文件默认路径:C:\Windows\System32\drivers\etc

    用管理员方式打开hosts文件

    ok,重新在浏览器中输入https://youzan.github.io/vant-weapp/#/intro即可成功打开

     

    展开全文
  • 在uni-app中使用vant-weapp

    千次阅读 2020-05-08 10:29:41
    1.在根目录下创建wxcomponents...1.在https://github.com/youzan/vant-weapp下载最新的zip压缩包 2.解压,将里面的dist文件放到vant里面 3.在App.vue中引入UI样式 @import "/wxcomponents/vant/dist/common/...

    1.在根目录下创建wxcomponents,wxcomponents下建文件夹vant

     

    2.项目引入

    1.在https://github.com/youzan/vant-weapp下载最新的zip压缩包
    2.解压,将里面的dist文件放到vant里面

     

    3.在App.vue中引入UI样式


    @import "/wxcomponents/vant/dist/common/index.wxss";

    4.在pages里面定义引入的组件

     

                "van-button": "/wxcomponents/vant/dist/button/index"
            }  
    

    5.在组件中使用

    https://youzan.github.io/vant-weapp/#/button和官网的使用方法一样。

     

    展开全文
  • uni-app中使用vant-weapp

    2021-03-12 16:42:43
    uni-app中使用Vant-Weapp组件 文章目录uni-app中使用Vant-Weapp组件前提1. 创建wxcomponents文件夹2. pages.json引入组件3. 组件中使用通过`easycom`将其精简为一步关于组件选择 Vant-Weapp官方文档 注意: uni-app ...

    uni-app中使用Vant-Weapp组件


    Vant-Weapp官方文档

    注意: uni-app 支持在 App小程序 中使用小程序自定义组件,从HBuilderX2.4.7起,H5端也可以运行微信小程序组件。

    前提

    • 先下载vant-weapp, 解压文件, 找到dist目录

    下载Vant-Weapp组件

    1. 创建wxcomponents文件夹

    uniapp小程序组件支持

    • 在项目根目录创建文件夹: wxcomponents ,将上面dist 文件复制到wxcomponents下,然后把dist名称修改为vant 【可根据需要使用所需组件】

    • 注意: wxcomponents特殊文件夹,vant可自定义。

    2. pages.json引入组件

    • 组件中引入方式 【 例: 使用buttonloading等组件】
    {
        "path": "pages/vant-btn/vant-btn",
        "style": {
           	"navigationBarTitleText": "自定义组件",
            "usingComponents": {
              	// #ifdef APP-PLUS || MP-WEIXIN || MP-QQ || H5
                "van-button": "/wxcomponents/vant/button/index",
                "van-loading": "/wxcomponents/vant/loading/index",
                "van-toast": "/wxcomponents/vant/toast/index"
                // #endif
            }
       	}
    },
    
    • 全局注册方式【根据需要使用全局注册】
    "globalStyle": {
        "usingComponents": {
            "van-button": "/wxcomponents/vant/button/index"
        }
    }
    

    3. 组件中使用

    <template>
    	<view class="wrap">
    		<view class="button">
                
    			<van-button type="primary" @click="onChange">van-button组件</van-button>
    			
    			<van-loading type="spinner" color="#1989fa" />
                
                <van-toast id="van-toast" />
                
    		</view>
    	</view>
    </template>
    
    
    <script>
    	import Toast from '../../wxcomponents/vant/toast/toast';
        
    	export default {
    		data() {
    			return {
    				
    			}
    		},
    		methods: {
    			onChange(e) {
    				Toast('toast');
    				
    				uni.navigateTo({
    					url: '/pages/list/list'
    				})
    			}
    		}
    	}
    </script>
    
    

    通过easycom将其精简为一步

    HBuilderX 2.5.5起支持easycom组件模式。

    easycom官方文档

    说明:

    • 不管components目录下安装了多少组件,easycom打包后会自动剔除没有使用的组件,对组件库的使用尤为友好。
    • easycom方式引入的组件无需在页面内import,也不需要在components内声明,即可在任意页面使用
    • easycom方式引入组件不是全局引入,而是局部引入。例如在H5端只有加载相应页面才会加载使用的组件
    "easycom": {
        "autoscan": true,
        "custom": {
            "^uni-(.*)": "@/components/uni-$1/uni-$1.vue", // 匹配components目录内的vue文件
        }
    },
    

    关于组件选择

    关于使用uni-app的ui库、ui框架、ui组件

    展开全文
  • 安装vant-weapp 组件

    千次阅读 2019-08-23 17:31:39
    可以查看官方文档: https://youzan.github.io/vant-weapp/#/quickstart 一、打开cmd 如果执行npm i vant-weapp -S --production 报错了: ...接着就可以执行:npm i vant-weapp -S --produ...
  • npm构建vant-weapp

    2020-11-10 09:41:59
    npm构建vant-weapp 1. 打开指定文件的cmd 2. 执行npm i vant-weapp -S --production 3. 如果出现package.json相关报错 则执行npm init -y 4. 接着重新执行npm i vant-weapp -S --production 5. 打开微信开发者–工具...
  • 使用vant-weapp组件 本文以vant-weapp为例 步骤见官网快速上手:https://vant-contrib.gitee.io/vant-weapp/#/quickstart 注意事项: webpack.base.config.js配置 - 作用: 在编译的时候在小程序中复制node_...
  • !... 导入npm模块后,在开发者工具中不显示,在硬盘中打开可以看到安装的vant的...已经使用语句npm i vant-weapp -S --production安装 并在工具中构建npm 项目本地设置也设置了使用npm模块 在线等大神帮忙!
  • 在开发中引入了 vant-weapp 导致项目包过大,真机调试不了,也上传不了,所以只能分包加载了。 实现 首先就是根据官方文档进行分包 但是有可能包体积还是过大,这时候只能进入到vant-weapp库的目录下,删除不必要...
  • 在我的页面需要用到vant-weapp的下拉菜单,将vant-weapp的示例代码复制到页面中,可惜没有显示内容,当我点击下拉菜单的时候控制台报错。以下是我的代码片段,希望能有大佬帮忙解答,谢谢! ``` <van-...
  • 基于taro2进行多端组件开发,迁移vant-weapp的组件库,兼容h5,微信小程序端,支付宝小程序端。 安装 npm i taro-vant yarn add taro-vant 使用前需要配置 因为我希望这个组件是可以用小程序原始组件混合编写的,...
  • uni-app整合最新版vant-weapp,遇到的问题和解决办法

    千次阅读 热门讨论 2020-03-30 12:41:13
    1.前往github下载vant-weapp组件库,github地址 2.在HBuilderX中新建uni-app项目,并在新项目的根目录下新建个目录,用于存放vant-weapp组件,我新建的目录名为wxcomponents为例 3.将步骤1的dist文件复制粘贴到...
  • vant-Weapp开发小程序

    2020-10-26 16:33:11
    最近写了一套基于vant-Weapp的小程序,里面有些功能还是挺实用的,但部分缺少可以通过solt,或者自己重写组件,遇到的一些坑进行分享一下: 调用这个框架需要以下条件: 1.npminstall vant-Weapp 2.小程序中设置...
  • 2020-8-7前来更新-------------------------------------------放上成品,可以参考参考: 之前用...然后,mpvue只是提供了代码编辑的框架而已,里面的组件之类需要第三方的组件库,我看到基本上用的vant-weapp的比...
  • uni-app 引入vant-weapp、lin-ui组件库

    千次阅读 2020-01-24 11:41:42
    引入Vant-Weapp 小程序ui组件库 vant-weapp github地址 直接通过 git 下载 Vant Weapp 源代码,并将dist目录拷贝到自己的项目中 引入Lin-UI 小程序ui组件库 git clone https://github.com/TaleLin/lin-ui.git 直接...
  • mpvue中使用vant-weapp

    2019-07-30 20:04:00
    npm i vant-weapp -S --production # 通过 yarn 安装 yarn add vant-weapp --production # 直接通过 git 下载 Vant Weapp 源代码,并将dist或lib目录拷贝到自己的项目中 git clone ...
  • uni-app引入UI组件库(Vant-weapp)步骤

    千次阅读 2020-03-27 15:41:13
    2.引入vant-weapp组件 在vant-weapp的GitHub Releases版块下载最新的zip包: https://github.com/youzan/vant-weapp/releases 下载完成效果如下: 将组件中的dist目录拷贝到创建好的va...
  • 集成vant-weapp v0.5.12后,未能完整编译该组件 <h2>Environment <ul><li>/cli2 version: [2.0.5]</li><li>/core version: [2.0.0]</li><li>vant-weapp version: [0.5.12]</li></ul> <h2>Reproduce <ul><li>...
  • 用过小程序的几个框架,最后还是选择了用vant-weapp,喜欢这款框架的原因,可能就是它里面的组件很多,很丰富,够用,在我的业务场景里面,大部分的需求都是可以在这个框架里面找到,不用自己大费周章的写代码,只...
  • uni-app引入UI组件库(Vant-weapp)

    千次阅读 2020-03-26 14:44:29
    uni-app引入UI组件库(Vant-weapp) 1. 新建相关目录 根目录下创建 wxcomponents wxcomponents下新建vant目录 2. 项目中引入vant-weapp组件 下载最新的zip包 (https://github.com/youzan/vant-weapp/releases)...
  • 2,下载安装包:vant-weapp 3, 项目中引入vant-weapp组件步骤。 ① 在根目录下创建 wxcomponents文件夹。 ② wxcomponents文件夹下新建vant文件夹。 创建完成后的目录结构 ↓ ③ 将dist目录复制粘贴到新建的vant...
  • PS:关于 van-area Area 省市区选择组件,地区数据初始化可以直接在云开发环境中导入vant-weapp/example/database_area.JSON文件使用 基础库版本 Vant Weapp 最低支持到小程序基础库 2.2.3 版本 链接 更新日志 ...

空空如也

空空如也

1 2 3 4 5 ... 20
收藏数 1,072
精华内容 428
关键字:

vant-weapp