MintUi踩坑记录

已于 2022-03-29 22:57:27 修改
阅读量174 收藏
点赞数
分类专栏： 工作沉淀 文章标签： vue.js
于 2021-04-17 12:30:18 首次发布
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/MissXu666/article/details/115793102
版权

在使用MintUi的时候,其用法和ElementUi类似,但是在按需使用MintUi按照官网的步骤无法正常运行,以下是注意点:

第一个注意点:即需要在mian.js中添加:

import MintUI from 'mint-ui'
import 'mint-ui/lib/style.css'
Vue.use(MintUI)

第二个注意点:在mian.js中不能使用use

Vue.use(Button)

而应该使用:

Vue.component(Button.name, Button)
Vue.component(Cell.name, Cell)
MissXu666
关注
专栏目录
vue使用mint-ui
你行你上
04-19 305
首先下载两个工具 ##安装包命令 npm install babel-plugin-component -D npm install @babel/preset-env -D 如果使用的vue-cli创建项目是vue create project的话第二个包自带了，不用下载 然后是配置babel.config.js文件 文件一开始内容是这样 module.exports = { presets: [ '@vue/cli-plugin-babel/preset' ] } 然后修改成这样： module.exp
VUE项目中使用mintui库遇到的坑
weixin_40140832的博客
12-04 262
mintui库中picker插件在ios的样式穿透问题 时间，地区，性别都是用picker插件做的，在Android测试的没有问题，但是在ios系统出现了样式穿透的问题，当滑动picker插件时，遮罩层下方的body区域也一起跟着上下滑动，给用户带来很差的体验感。 上网搜了一下解决方案，借鉴了另一个大佬写的，简单易懂，直接套用在项目中，帮我解决了这个问题，太感谢啦，趁热给整理出来！看的大佬的文章地...
一:移动端UI框架mint-ui
weixin_45842655的博客
12-07 3120
声明:本文仅用于学习分享.是根据教学视频做的笔记,如涉及侵权,可联系我立即删除,谢谢! Mint-UI中按钮组件的使用 简介:Mint UI是基于 Vue.js 的移动端组件库.mint-ui官网 1.安装 // 安装 # Vue 1.x npm install mint-ui@1 -S # Vue 2.0 npm install mint-ui -S 2.引入 // 引入全部组件 //先引入v...
MintUI（详见官方文档）
li_ding_ding的博客
03-17 1万+
MintUI MintUI是饿了么团队开发的基于移动端的vue组件库。用于搭建移动端界面。 http://mint-ui.github.io/docs/#/zh-cn2 Vant组件库也是基于移动端的vue组件库（有赞团队）。 https://vant-contrib.gitee.io/vant/v2/#/zh-CN/ 基于脚手架项目安装mintui 新建项目。 # 找一个空文件夹 VUEUI/day01/demo下执行一个命令 vue create scaffolding # 依次选择 Manu
Mint UI —— 基于 Vue.js 的移动端组件库
abcde158308的博客
03-20 1万+
写文章登录Mint UI —— 基于 Vue.js 的移动端组件库杨奕8 个月前Mint UIGitHub：https://github.com/ElemeFE/mint-ui项目主页：http://mint-ui.github.io/#!/zh-cnDemo：http://elemefe.github.io/mint-ui/#!/文档：http://mint-ui.github.io/docs/...
详解Vue2.0配置mint-ui踩过的那些坑
12-12
最近开发项目的时候逐渐采用vue.js+mint-ui的技术栈，但是昨天开始配置开发环境的时候，遇到了各种报错，即使是按照两家的官方文档配置，也还是会报错，晚上下班后回去配置了一晚上，才终于把它配置好，所以就记录...
vue 项目初始化准备,踩坑记录，持续更新(仅供自己参考)
樊云飞
09-04 323
安装sass npm install node-sass --save-dev npm install sass-loader --save-dev
vue-cli3-element-ui 开发项目中遇到的坑以及解决方案
郝峰vip的博客
04-21 583
前言 小编在开发新项目中，pc端用的是vuecli3+element-ui，移动端用的是vue-cli3+vant-ui或者vue-cli3+mint-ui，在这篇文章就把在开发pc端项目中也就是使用vuecli3+element-ui过程中遇到的坑和解决方案记录下来，方便后续自己学习。 目前使用的element-ui版本是2.15.1,这里记录版本的原因是，之前用过低版本遇到的坑发现后来随着element-ui版本的更新给优化了，所以这里记录一下版本号。 这篇博客会随着开发中不断地踩坑持续更新的。\
vue-mint-ui简单使用
不想起床
05-16 6901
首先项目用到了mint-ui 安装 cnpm i mint-ui -S 然后按照官网的操作，将mint-ui导入main.js 实操 将所有准备工作准备就绪，下面就可以使用mint-ui 在main.js 里面，render要渲染的是app 而app是从App.vue里面导入的，所以要想实现渲染，要在App.vue里面写 先来看看官网的CSS 不要慌，跟boo...
mint-ui 各个组件示例
热门推荐
奔跑的IT小白的博客
04-12 3万+
项目源码GitHub地址：https://github.com/wuhuisiyue/mint-ui.git； 前期网络请求都是利用定时器来模拟，根据项目需求修改成真正的网络请求就可以用了； 个人邮箱： xxwangkaimin@sina.com；大家有建议都可以发这个邮箱； 示例建议使用手机打开，或者浏览器开启手机模拟 示例网址： http://mint.wkmblog.com 更...
Mint UI组件库CheckList使用及踩坑总结
10-17
主要介绍了Mint UI组件库CheckList使用及踩坑总结，小编觉得挺不错的，现在分享给大家，也给大家做个参考。一起跟随小编过来看看吧
Mint UI入门系列教程
祈澈菇凉
05-03 1955
Vue移动端框架Mint UI教程-搭建环境引入框架（一） 官网：https://mint-ui.github.io/#!/zh-cn Github: https://github.com/ElemeFE/mint-ui/ 今天具体说一说比较常用的；Mint UI框架的按钮组件，Mint UI是 饿了么团队开发基于vue .js的移动端UI框架...
mint-ui官网无法打开的解决方法
qq_36016136的博客
11-03 2377
看了网上的解决方案，大体有两种，一种是将http协议更改为https协议，即mint-ui官方地址，今天就说说第二种方式 step1：前往“站长工具”查询mint-ui.github.io的DNS 站长工具路径 step2:找到TTL值最小的那个的ip地址 和 unit-ui的网址对应关系，配置到hosts文件中 step3:修改hosts配置文件如下，该另外一种就是修改hosts文件，该文件本地上的地址一般为C:\Windows\System32\drivers\etc 但是在这个过程中，可能会出现hos
mint-ui 的navbar踩坑记
weixin_34407348的博客
01-18 469
首先，mt-tab-item不支持v-for <mt-tab-item v-for="(item,key) in list" :key="key" id="item.title">{{item.title}}</mt-tab-item> 能正常显示导航，但点击任何一个菜单，都会全部选中，所以只能像例子一样，一个个写。 其次...
Mint-UI简单实例
yan101795的博客
12-13 408
使用饿了吗的 基于 Vue.js 的移动端组件库——Mint UI 实现的简单功能:点击‘test’按钮，弹出：‘提示信息’。安装和运行请看上一篇文章，这里直接贴代码 index.html文件代码 <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <meta name="viewport" content="width=device-width, initial-scale=1, maxi.
mint ui 学习笔记（1）
fmk1023的博客
12-18 220
Mint UI 基于 Vue.js 的移动端组件库 官方网站：http://mint-ui.github.io/#!/zh-cn 快速开始 安装 Mint UI // 安装 # Vue 2.0 npm install mint-ui -S 然后在项目中的main.js文件引入所有组件 // 引入全部组件 import Vue from 'vue'; import Mint from 'mint-ui'; Vue.use(Mint); // 按需引入部分组件 import { Cell, Checklist
mint-ui —— checklist的使用
michael的博客
07-29 1万+
Import 按需引入： import { Checklist } from 'mint-ui'; Vue.component(Checklist.name, Checklist);   全局导入：全局导入后不用再导入 import Mint from 'mint-ui' import 'mint-ui/lib/style.css' Vue.use(Mint);
那些我们使用VUE2.0+Mint-ui+axios踩过的坑
Doniet的专栏
01-25 2507
前言 公司有一个项目，要求做到组件最大限度重用；由于项目比较赶，于是我决定使用比较熟悉VUE2.0来开发。没想到，让我踩了一大片的坑。虽然项目最终还是上线了，但是那些坑，让我每每想到都会有一股洪荒之力在体内流窜。 那些坑 修改Mint-ui的样式 项目中要对所有的客户端做适配，Mint-ui并做任何适配，因此，部分组件需要调整样式。可是在组件中去改变样式发现，并没...
mint-ui 下拉组件loadmore踩坑
woyidingshijingcheng的博客
04-12 1万+
mint-ui是vue开发中常用的组件库，而loadmore 通常用于处理下拉加载与上拉加载坑1、页面渲染完，loadmore设置的上拉/下拉执行两次产生原因：loadmore设置中的auto-fill需要设置为false实现代码如下：&lt;load-more :bottom-method="loadBottom" :bottom-all-loaded="isLoadAll" ref="load...
Mint UI使用
最新发布
06-01
Mint UI 是一个基于 Vue.js 的移动端 UI 组件库，它提供了大量的常用组件和样式，能够帮助我们快速构建移动端页面。下面简单介绍一下如何在 Vue3 中使用 Mint UI： 1. 安装 Mint UI 可以通过 npm 安装 Mint UI： ```shell npm install mint-ui -S ``` 2. 引入 Mint UI 在 main.js 中引入 Mint UI： ```js import { createApp } from 'vue' import MintUI from 'mint-ui'; import 'mint-ui/lib/style.css'; import App from './App.vue' const app = createApp(App) app.use(MintUI) app.mount('#app') ``` 3. 使用 Mint UI 组件 在组件中直接使用 Mint UI 提供的组件，例如： ```html <template> <div> <mt-header fixed title="Header"></mt-header> <mt-button type="primary">Primary Button</mt-button> <mt-tab-container> <mt-tab-container-item title="Tab1"> <p>Tab1 Content</p> </mt-tab-container-item> <mt-tab-container-item title="Tab2"> <p>Tab2 Content</p> </mt-tab-container-item> </mt-tab-container> </div> </template> <script> export default { name: 'MyComponent' } </script> ``` 以上就是在 Vue3 中使用 Mint UI 的基本步骤，希望能够帮助到你。
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值