Bug:elementUI样式不起作用、Vue引入组件报错not found等(Vue+ElementUI问题汇总)

这篇具有很好参考价值的文章主要介绍了Bug:elementUI样式不起作用、Vue引入组件报错not found等(Vue+ElementUI问题汇总)。希望对大家有所帮助。如果存在错误或未考虑完全的地方,请大家不吝赐教,您也可以点击"举报违法"按钮提交疑问。

前端问题合集:Vue+ElementUI

1. Vue引用Element-UI时,组件无效果解决方案

前提:

  • 已经安装好elementUI依赖
//安装依赖
npm install element-ui
//main.js中导入依赖并在全局中使用
import ElementUI from 'element-ui'
Vue.use(ElementUI)

如果此时发现element的组件依然没起效果,原因:未引入css样式文件
当前效果:
element ui用不了,bug,bug,elementui,前端
预期效果:
element ui用不了,bug,bug,elementui,前端

解决办法:在main.js中引入css文件

//引入element-ui所提供样式
import ElementUI from 'element-ui'
// element-ui所提供的css样式
import 'element-ui/lib/theme-chalk/index.css'

element ui用不了,bug,bug,elementui,前端

2. Vue引入components报错:export xxx not found

在pages文件夹的Register.vue页面中引入components下的RegisterLogo.vue报错:
export ‘xxx‘ was not found in ‘xxx‘或This relative module was not found:‘xxx‘

解决办法:
方法一:观察是否是组件名称、导入方式等错误

  • RegisterLogo.vue的export default中name字段是否能与Register.vue中的对应上
    element ui用不了,bug,bug,elementui,前端
  • 注意引入路径是否正确,引入时组件是否有在components字段中添加,使用时是否有带反斜线,引入RegisterLogo.vue时,是否有加花括号
    element ui用不了,bug,bug,elementui,前端

方法二:将花括号去掉
element ui用不了,bug,bug,elementui,前端文章来源地址https://www.toymoban.com/news/detail-730046.html

到了这里,关于Bug:elementUI样式不起作用、Vue引入组件报错not found等(Vue+ElementUI问题汇总)的文章就介绍完了。如果您还想了解更多内容,请在右上角搜索TOY模板网以前的文章或继续浏览下面的相关文章,希望大家以后多多支持TOY模板网!

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处: 如若内容造成侵权/违法违规/事实不符,请点击违法举报进行投诉反馈,一经查实,立即删除!

领支付宝红包 赞助服务器费用

相关文章

  • Vue3 - 解决使用 Tailwindcss 后导致 UI 组件库样式受影响,引入后发现项目组件库的组件样式不对了(Element/Ant Design Vue/Naive UI/TDesign)

    网上的教程都无法解决,但本文可以帮助您快速解决该问题。 当项目引入 Tailwind css 后,使用 UI 组件库的某些组件时,发现有些样式丢失及显示错位、背景色丢失等问题, 频发于【按钮组件】背景色丢失 | 【message消息提示组件】样式位置变形等,严重的整个组件库样式都乱

    2024年02月07日
    浏览(60)
  • Uniapp开发件微信小程序,自定义组件@click不起作用

    有的人说添加@click后面​ .native,我遇到的问题用这个方法并不行, 最后解决办法是在自定义组件内把事件把点击事件传递出去

    2024年02月11日
    浏览(43)
  • 如何更改Elementui组件样式

    作为一个后端开发人员,因工作需要,前端也要写,最近刚开始使用前端vue和elementui开发前端页面时,碰到了一些问题。产品图上的样式与elementui组件样式不同。后经查阅资料发现了更改elementui组件自带样式的方法,现分享如下: 如果我们想修改一个button按钮的样式该如何做

    2024年02月12日
    浏览(59)
  • 处理ElementUI组件默认样式多次重复问题

    在postcss.config.js文件里添加配置项:

    2024年02月07日
    浏览(41)
  • vue项目中beforeDestroy和destroyed 钩子不起作用或者说不生效的原因和解决办法

    项目中,在destroyed 写了东西,不生效,后来发现beforeDestroy也没走,就很好奇,为什么?进来的程序猿/程序媛是不是和我一样呢? ** ** 这时候排查原因,不断的找,最后发现,很简单,keep-alive的原因,keep-alive 是 Vue 的内置组件,当它包裹动态组件时,会缓存不活动的组件实

    2024年02月13日
    浏览(39)
  • elementUI 的上传组件<el-upload>,自定义上传按钮样式

    原理:调用el-upload组件的方法唤起选择文件事件 效果: 页面代码: js代码:(其他逻辑与element文档的上使用一致) css代码: 隐藏原来的选择图片按钮 原理:把图片显示分离出来,el-upload做选择图片使用,单独做一个显示图片的区域 效果:  页面代码: js 代码: css代码:

    2024年02月13日
    浏览(42)
  • vue3项目使用样式穿透修改elementUI默认样式

    在css单文件中,我们在style标签中写组件的样式,可以看到,一般style标签都会带上一个scoped属性,这样可以实现及时不同组件选择器一样,但是样式互不干扰。 看一个例子,我们在两个组件中都定义一个 hello-world-box 类,在对应的scope标签中设置不同的样式。 可以看到,vu

    2023年04月09日
    浏览(42)
  • Vue项目中实现ElementUI按需引入

    🐱 个人主页: 不叫猫先生 🙋‍♂️ 作者简介:2022年度博客之星前端领域TOP 2,前端领域优质作者、阿里云专家博主,专注于前端各领域技术,共同学习共同进步,一起加油呀! 💫优质专栏:vue3从入门到精通、TypeScript从入门到实践 📢 资料领取:前端进阶资料可以找我免

    2024年02月04日
    浏览(44)
  • Vue3项目中引入ElementUI使用详解

    ElementUI 是一个强大的PC端UI组件框架,它不依赖于vue,但是却是当前和vue配合做项目开发的一个比较好的ui框架,其包含了布局( layout ),容器( container )等各类组件,基本上能满足日常网站的搭建开发。针对vue2和vue3都有对应的组件版本,本文主要介绍在vue3中如何引入使用

    2024年02月10日
    浏览(51)
  • 【vue+elementUI】输入框样式、选择器样式、树形选择器和下拉框样式修改

    写在style中不能加scoped,所以可以在最外层的div加一个专属名再写样式: A. 选择器的下拉弹框样式修改 el-select下拉项的的容器是div#app之外的,所以在scoped作用域内使用或/deep/修改样式无效,要想: 官网如是说:加 :popper-append-to-body=\\\"false\\\" 代码像普通样子写: B. 时间选择器的下

    2024年02月07日
    浏览(46)

觉得文章有用就打赏一下文章作者

支付宝扫一扫打赏

博客赞助

微信扫一扫打赏

请作者喝杯咖啡吧~博客赞助

支付宝扫一扫领取红包,优惠每天领

二维码1

领取红包

二维码2

领红包