下面提供几个解决方案

方案一:

官方文档有说明,将 app.json 中的 "style": "v2" 去除,小程序的新版基础组件强行加上了许多样式,难以覆盖,不关闭将造成部分组件样式混乱。



方案二:

网上说了很多解决方案,例如:

1、可能是布局样式有冲突 推测可能是flex 布局

2、app.json中取消懒加载

......

这些方法我都试过了,还是无法解决,最后通过清除缓存,重新编译的方式解决了,如下:



编译之后样式就会出现,这是第一种方法

第二种



构建npm包后重新加载,样式也会出现

微信小程序使用vant组件样式不生效的问题的更多相关文章

  1. 微信小程序覆盖自定义组件样式

    小程序官方文档明确指出,引入的第三方自定义组件,是不可以对其进行CSS样式覆盖的,但是我们还想要修改怎么办呢?自定义组件时会之定义个外部类,通过这个外部类来修改样式. 修改https://weapp. ...

  2. 微信小程序引入Vant组件库

    前期准备 Vant Weapp组件库:https://youzan.github.io/vant-weapp/#/intro 1.先在微信开发者工具中打开项目的终端: 然后初始化一个package.j ...

  3. uni-app开发微信小程序引入UI组件库(Vant-weapp)步骤

    uni-app开发微信小程序引入UI组件库(Vant-weapp)步骤 这里以vant-weapp为例 uni-app官方文档介绍引入组件的方法 1. 新建相关目录 根目录下创建 wxcomponen ...

  4. 微信小程序校历组件

    微信小程序校历组件 校历组件,可以作为校园小程序的插件,如果觉得不错,点个star吧

  5. 原创:WeZRender:微信小程序Canvas增强组件

    WeZRender是一个微信小程序Canvas增强组件,基于HTML5 Canvas类库ZRender. 使用 WXML: <canvas style="width: 375px; h ...

  6. 微信小程序之swiper组件高度自适应

    微信小程序之swiper组件高度自适应 要求: (顶部广告栏 ) 改变swiper组件的固定高度,使之随内部每张图片的高度做自适应 原理: 图片加载完之后,获取图片的原始宽高,根据宽高比,计算出适应后 ...

  7. 微信小程序中的组件使用1

    不管是vue还是react中,都在强调组件思想,同样,在微信小程序中也是使用组件思想来实现页面复用的,下面就简单介绍一下微信小程序中的组件思想. 组件定义与使用 要使用组件,首先需要有组件页面和使用组 ...

  8. 微信小程序的布局css样式

    微信小程序的布局css样式width: fit-content;font-size:20px;      /*设置文字字号*/color:red;           /*设置文字颜色*/font-w ...

  9. 微信小程序基于swiper组件的tab切换

    代码地址如下:http://www.demodashi.com/demo/14010.html 一.前期准备工作 软件环境:微信开发者工具 官方下载地址:https://mp.weixin.qq.co ...

  10. 关于微信小程序前端Canvas组件教程

    关于微信小程序前端Canvas组件教程 微信小程序Canvas接口函数 ​ 上述为微信小程序Canvas的内部接口,通过熟练使用Canvas,即可画出较为美观的前端页面.下面是使用微信小程序画图的一些 ...

随机推荐

  1. JDK动态代理深入剖析

    1 基于接口的代理模式 什么是代理? 简单来说,代理是指一个对象代替另一个对象去做某些事情. 例如,对于每个程序员来说,他都有编程的能力: interface Programmable { void ...

  2. 关于最新版本listen1 (2.1.6)的修改心得(添加下载功能)

    注:本文只作为技术交流 前言 再次感谢 listen1 的作者开发出如此强大的音乐播放器 项目地址 上一篇的文章没有解决跨域问题(命名不能正确命名), 上一篇文章 地址 这次解决了,并简单的美化了下载 ...

  3. 求10以内所有偶数和-Java

    public class Demo{ //求10以内所有偶数和 public static void main (String[] args){ int sum = 0; for(int i = 0; ...

  4. WeetCode3 暴力递归->记忆化搜索->动态规划

    笔者这里总结的是一种套路,这种套路笔者最先是从左程云的b站视频学习到的 本文进行简单总结 系列文章目录和关于我 一丶动态规划的思想 使用dp数组记录之前状态计算的最佳结果,找出当前状态和之前状态的关系 ...

  5. 2.9:数据交换-csv、Excel、json、爬虫、Tushare获取数据

    〇.任务 1. 使用Python基础文件读写函数完成CSV文件的处理: 2. 使用标准CSV库完成CSV文件的处理: 3. 使用Excel库完成Excel文件的处理: 4. Python数据结构和Js ...

  6. 【Java SE】Day09 继承、super、this、抽象类

    一.继承 1.概述 多个类具有相同属性和行为,共性抽取到一个类中(父类) 父类更通用,子类更具体 2.继承后的成员变量 本类:this.成员变量名 父类:super.成员变量名 3.继承后的成员方法 ...

  7. Windows 安装 Zookeeper 详细步骤

    Windows 安装 Zookeeper 详细步骤 一. Zookeeper 安装包下载 1.官网地址 Zookeeper官网 2.安装包下载 这里选择目前的稳定版 3.6.3 下载 可以看到有两个选 ...

  8. 数据库MySQL(完结)

    SQL注入问题 简介 针对SQL注入的攻击行为可描述为通过用户可控参数中注入SQL语法,破坏原有SQL结构,达到编写程序意料之外结果的攻击行为. 其成因可归结为以下两个原理叠加造成: 程序编写者在处理 ...

  9. 跳石头(NOIP2015)

    AcWing 洛谷 解题思路 这题看到最短跳跃距离尽可能长就会想到二分 但是我们二分的\(check\)函数怎么写呢 可以看到限制条件移走的石头最多只能是\(m\)块 我们二分这个最短距离 容易想到一 ...

  10. (已转)C++知识图谱