Uni-app使用vant和uview组件

news2024/11/22 13:16:56

目录

1.安装vant组件

1.1安装前需知

 1.2.安装

1.3.创建uni-app项目

2.安装uview-ui组件

2.1官网

2.2安装 

2.3安装成功


1.安装vant组件

1.1安装前需知

小程序能使用vant-weapp组件,且官网的安装是直接导入小程序中,不能直接导入uni-app框架中

Vant Weapp - 轻量、可靠的小程序 UI 组件库

 1.2.安装

再github上下载https://github.com/youzan/vant-weapp/releases

其中目录为

讲里面的组件引入自己新创建的wxcomponents文件中且必须是这个名字

1.3.创建uni-app项目

 

结果成功

2.安装uview-ui组件

2.1官网

uView UI

在线文档介绍 | uView 2.0 - 全面兼容nvue的uni-app生态框架 - uni-app UI框架 (uviewui.com)

2.2安装 

如果没有pages.json

npm init -y 

安装对应依赖

npm install uview-ui@2.0.31 

在main.js中引入

import uView from "uview-ui";

Vue.use(uView); 

在pages.json引入对应

easycom是一种引入规则,不需要导包就可以使用

	"easycom": {
	"^u-(.*)": "uview-ui/components/u-$1/u-$1.vue"
	},

 

2.3安装成功

 

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.coloradmin.cn/o/366075.html

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈,一经查实,立即删除!

相关文章

Python的标准模块介绍:sys、os、random和time

Python内置了许多标准模块,例如sys、os、random和time模块等,下面为大家介绍几个常用的标准模块。 1.sys模块 sys模块中提供了一系列与Python解释器交互的函数和变量,用于操控Python的运行时环境。sys模块中常用变量与函数如表1所示。 表1…

Apifox = Postman + Swagger + Mock + JMeter

目录 可视化API设计 高效 & 零学习成本 可复用的“数据模型” 遵循 OpenAPI(Swagger) 规范 可导入 Swagger 等 20 数据格式 具体使用尝鲜 多项目管理 支持多环境切换 支持IDEA、浏览器、桌面应用 Idea插件 公共API hub库 如题:一款非常好用的API管理测…

二叉树——最大二叉树

最大二叉树 链接 给定一个不重复的整数数组 nums 。 最大二叉树 可以用下面的算法从 nums 递归地构建: 创建一个根节点,其值为 nums 中的最大值。 递归地在最大值 左边 的 子数组前缀上 构建左子树。 递归地在最大值 右边 的 子数组后缀上 构建右子树。 返回 nums…

浅谈面向过程和面向对象的区别

面向过程和面向对象都是对软件分析、设计和开发的一种思想,它指导着人们以不同的方式去分析、设计和开发软件。 伴随着每个开发人员的职业生涯,或多或少都会接触到这两种软件设计思想。不仅是软件开发人员,其实这两种思想在我们平时的生活中也处处可见&a…

uniapp 超过2m无法上传代码!uni-module太大了,小程序无法上传怎么办?

问题描述: 虽然分包了。但是主包里还有很多uniui的组件,占了2m多,之前一直是点击运行,然后再上传代码。提示的超过2m无法上传。 解决办法: 点击发行,然后上传就可以了。 优化建议: 1、组件按…

面向对象的一点小想法

接口里的方法可以写也可以不写 如果写的话,那么得是默认方法,需要在前面加个default 对于默认方法,能够重写,或者直接继承(也就是直接用) 比如下面: 就直接调用了接口的默认函数nibuhao&#…

MongoDB安装和使用过程常见问题

文章目录一、安装过程显示没有相应的权限二、pymongo无法使用,报错一、安装过程显示没有相应的权限 oh我的天,找了网上很多种方法都不行哈哈 不同的电脑对应不同的问题吧~ 我的这个问题是这样解决滴 先直接简述操作路径,不明白的可以看如下图…

程序员生产力工具大全,软件开发者常用的工具有哪些?

有哪些神器,可以帮助程序员提高工作效率? 每一位程序员,都希望能在编程世界中实现自己的梦想。程序员是一个要不断向上攀爬的职业,需要学习新的知识,掌握新的工具,才能跟上时代的步伐。 工欲善其事&#…

Linux PWM 开发指南

Linux PWM 开发指南 1 概述 1.1 编写目的 介绍 PWM 模块的详细设计方便相关人员进行 PWM 模块的代码设计开发。 1.2 使用范围 适用于 Linux-3.10,linux-4.4 和 Linux-4.9 内核,Linux-5.4 内核。 1.3 相关人员 PWM 驱动的开发人员/维护人员等 2 术…

2022 赣育杯 CTF --- Crypto Lost_N wp

文章目录前言题目解题过程解题代码前言 这是去年江西省赛一道有点小坑的密码题,当时没做出来,今天回想起来重新做一下并且记录一下。 题目 Lost_N.py import gmpy2 from Crypto.Util.number import * # part1 flag bSangFor{} d getPrime(435) cou…

一篇文章弄清楚啥是数组和集合

数组和集合多语言都有,数组是集合的一种,是一种有序的集合,不面向对象,面向过程的也有。1.数组逻辑结构:线性的物理结构:顺序的存储结构申请内存:一次申请一大段连续的空间,一旦申请…

JAVA虚拟机JVM之内存模型

内存模型 java 内存模型 很多人将【java 内存结构】与【java 内存模型】傻傻分不清,【java 内存模型】是 Java Memory Model(JMM)的意思。 关于它的权威解释,请参考 https://download.oracle.com/otn-pub/jcp/memory_model-1.0…

【C++】string的9道OJ题

要么庸俗,要么孤独… 文章目录一、仅仅反转字母二、字符串中的第一个唯一字符(计数排序的思想)三、字符串相加(做好加进位的工作即可)四、把字符串转换成整数五、反转字符串中的单词 III六、字符串相乘(高…

惠普庆祝在中国40年,强化中国发展战略

中国北京,2023年2月23日 ——今日,“品质信赖向未来” 惠普在中国40年系列活动启动仪式及惠普打印春季新品发布会在北京盛大举行。现场,惠普回顾了40年来与中国经济及产业共同发展的历程,并再次强调了惠普一以贯之的“在中国&…

3.GORM介绍和使用

目录 来源 什么是ORM ORM的优缺点 gorm介绍 安装 连接数据库 连接MySQL 连接PostgreSQL 连接Sqlite3 连接SQL Server GORM基本示例 Docker快速创建MySQL实例 创建数据库 GORM操作MySQL GORM Model定义 gorm.Model 模型定义示例 结构体标记(tags&a…

力扣-文章浏览

大家好,我是空空star,本篇带大家了解一道简单的力扣sql练习题。 文章目录前言一、题目:1148. 文章浏览二、解题1.正确示范①提交SQL运行结果2.正确示范②提交SQL运行结果3.正确示范③提交SQL运行结果4.其他总结前言 一、题目:1148…

立项近7年,索尼产品经理分享PS VR2开发背后的故事

备受期待的索尼PS VR2终于正式发售,VR爱好者们终于有机会体验到《地平线:山之呼唤》等PS VR2独占的VR大作。近期,为了解PS VR2头显诞生背后的故事,外媒AV Watch采访到PS VR2的开发负责人Yasuo Takahashi,在本次采访中&…

尚医通 (二十二)微信支付

目录一、微信支付介绍1、微信扫码支付申请2、开发文档3、微信支付SDK二、微信支付开发2、微信支付前端整合三、订单支付后处理一、微信支付介绍 1、微信扫码支付申请 微信扫码支付是商户系统按微信支付协议生成支付二维码,用户再用微信“扫一扫”完成支付的模式。…

若依框架整合JSP

今天接到组长任务要求SpringbootJSP完成页面渲染,因为是用的若依框架,一上午零零散散的找了很多资料和视频,没有达到理想的结果,在下午中午弄出来了,于是整理出来供大家查看引用。(单纯Springboot项目怎么建…

webRTC学习-基础知识

webRTC学习1、webRTC简介1.1什么是webRTC?1.2、作用2、webRTC通信原理2.1、媒体协商(SDP)2.2、网络协商(candidate)2.2.1、STUN2.2.2、TURN2.3、媒体协商网络协商数据的交换通道webRTC官网1、webRTC简介 1.1什么是web…