关于vant:vant-引入icon-字体图标

Icon 组件默认援用有赞 CDN 提供的字体文件,并通过网络下载。如果须要在我的项目中应用本地字体文件,请引入上面的 CSS 文件,并在我的项目中配置 url-loader。 减少webpack.config.js配置module.exports = function () { if (process.env.BUILD_TARGET === 'package') { return {}; } return { entry: { 'site-mobile': ['./docs/site/entry'], 'site-desktop': ['./docs/site/entry'], }, module:{ rules:[ { test: /\.(woff2?|eot|ttf|otf)(\?.*)?$/, loader: 'url-loader', options: { limit: 10000, name: utils.assetsPath('fonts/[name].[hash:7].[ext]') } } ] } }; };UnhandledPromiseRejectionWarning: ReferenceError: utils is not definedurl-loader 装置版本过高,装置一个低版本的,有装置2.0.0,3.0.0都不行,最终抉择1.0.0 引入css文件@import '../../packages/vant-icons/assets/iconfont/style.css';批改style.css设置font-family 和加前缀 van-icon.van-icon-test:before { content: "\e905";}

September 20, 2021 · 1 min · jiezi

关于vant:利用Vant骨架屏中的类名快速实现自定义骨架屏

最近在我的项目中遇到一个须要在加载数据时把指定的div弄成骨架屏的样子,而我的项目正好依赖Vant,但应用Vant中默认的骨架屏并不合乎需要。于是我用F12找到动画起作用的那一层div找到相应的类名间接加到我须要显示骨架屏的最外层div,成果就间接实现了。 van-skeleton--animate在须要骨架屏动画的最外层div加上这个类名就能实现成果,前提是不能自己在内层div加太多的款式。

September 16, 2020 · 1 min · jiezi

vant-DatetimePicker-时间插件样式错乱不对齐问题

vant DatetimePicker 工夫插件款式错乱针对的是iphoneXS-max,iphone11,个别安卓机的零碎就会呈现款式错乱未对齐问题 仔细阅读vant官网后发现两个属性 [vant官网] (https://youzan.github.io/vant... API---Props属性item-height 选项高度,反对 px 和 rem 单位,默认 px,默认是 44visible-item-count 可见的选项个数,默认是 5 填上这两个属性,改一下值就能够啦。 <!-- 抉择访问工夫弹出层 --><van-popup v-model="showVisitDate" round position="bottom"> <van-datetime-picker item-height='45' visible-item-count='4' v-model="currentDate" type="datetime" title="请抉择访问工夫" :min-date="minDate" :max-date="maxDate" :formatter="formatter" @cancel="showVisitDate = false" @confirm="confirmVisitDateMethod" /></van-popup>如图

July 16, 2020 · 1 min · jiezi