el-backtop不显示的问题

最新推荐文章于 2024-12-27 14:32:04 发布
最新推荐文章于 2024-12-27 14:32:04 发布
阅读量721 收藏 7
点赞数 9
CC 4.0 BY-SA版权
文章标签： vue.js 前端 javascript
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.youkuaiyun.com/manonglanye/article/details/135482488
本文讲述了在使用ElementUI的el-scrollbar组件时遇到不显示问题，通过在el-backtop标签中增加target属性值.el-scrollbar__wrap解决了这一问题，提到了具体的bottom和right属性配置。

摘要生成于 C知道 ，由 DeepSeek-R1 满血版支持， 前往体验 >

我这边是在el-scrollbar里面不显示

解决方法是在el-backtop 标签中增加 target=".el-scrollbar__wrap"
<el-scrollbar>
  <!-- 一些其他代码 -->
  <el-backtop target=".el-scrollbar__wrap" :right="20" :bottom="10" />
</el-scrollbar>
manonglanye
关注
关于element-ui backtop 不生效，无显示
levi2469的博客
01-11 3156
1、不用target属性也可以使用 <el-backtop></el-backtop> 2、用target属性 <template> Scroll down to see the bottom-right button. <el-backtop target=".page-component__scroll .el-scrollbar__wrap"></el-backtop> </template> target：指向需要
Web前端篇——ElementUI的Backtop 不显示问题
u011391361的博客
01-03 2736
ElementUI的Backtop 不显示问题
elementUI的el-backtop(返回顶部)不生效
weixin_54930261的博客
12-30 5627
这个是基础用法，自定义用法跟这个也差不多，就是中间加了些样式。看起来这个例子很简单对不对，按照最简单的原则拿过来就用，Ctrl+C到自己项目后就等着出现回到顶部按钮，结果实际结果却令我大失所望，直接报错了。，心想这下子应该是可以了吧。结果运行的时候错误是没有了，但是那个心心念念的回到顶部按钮怎么都出现不了，难道是我姿势不对？目前我采用的方法是简单粗暴的删除target不指定对象， 也是能显现按钮，并且回到顶部。既然给出了原因，那解决应该很简单，不是找不到这个样式吗，那我就在外层套个。的功能的时候遇到坑了。
el-backtop置顶功能报错和页面不展示问题
miem_yang的博客
12-03 435
根据官网例子直接使用发现页面并没有反应，而且可能还会遇到报错的问题。
el-backtop不起作用的解决办法
wmklalala的博客
02-16 6974
插入官网上的代码发现不起作用还会报错 <el-backtop target=".page-component__scroll .el-scrollbar__wrap"></el-backtop> 更改为以下代码即可 <el-backtop></el-backtop> ...
解决vue3中使用el-backtop 无效
欢迎来到我的小世界
03-03 1470
解决vue3中使用el-backtop 无效
el-backtop 如何使用
最新发布
03-14
好的，我现在需要帮助用户解决关于element-ui中el-backtop组件的使用问题。用户提到他们参考了一些现有的引用内容，但可能在使用过程中遇到了问题，比如代码不生效的情况。我需要根据提供的引用信息和自己的知识来...
在vue2项目中的el-dialog 弹框中如何使用el-backtop
11-01
在Vue 2项目中，`el-dialog` 是Element UI提供的弹窗组件，它默认并不包含`el-backtop`这个插件。然而，如果你想在弹框中添加返回顶部的功能，你可以手动引入并使用`el-backtop`。以下是简单的步骤： 1. 首先，你...
Element Backtop回到顶部的具体使用
10-15
<el-backtop target=".page-component__scroll .el-scrollbar__wrap"></el-backtop> ``` 这里，`target`属性非常重要，它指定了当滚动到哪个元素时，`Backtop`按钮将会出现。在上面的例子中，当`.page-component...
button el-backtop 怎么调用
01-20
在使用 Vue.js 开发中，可以通过以下步骤来调用 el-backtop 组件： 首先，在 Vue 组件中引入 el-backtop 组件： ...通过以上的步骤，就可以在 Vue.js 中调用 el-backtop 组件，并根据需要来控制它的显示和行为。
<pc-layout-tow v-if="cutTemplates === 'themeTemplate'"></pc-layout-tow> <el-backtop :bottom="50"></el-backtop>这段代码是什么意思
07-14
`<el-backtop :bottom="50"></el-backtop>` 则是渲染一个 `<el-backtop>` 组件，并设置了一个属性 `bottom` 的值为 `50`。这个组件通常用于在页面滚动时显示一个返回顶部的按钮，并通过 `bottom` 属性来设置按钮距离...
Element-ui 回到顶部组件不显示问题解决
chenjun1992的博客
06-06 2900
Element-ui官网自定义回到顶部插件内容如下，但是复制到自己的代码里没有显示。 <template> Scroll down to see the bottom-right button. <el-backtop target=".page-component__scroll .el-scrollbar__wrap" :bottom="100"> <div style="{ height: 100%; width
[BUG记录] Element Plus 的 Backtop 组件未生效
ymzhao
06-14 1921
vue项目，页面使用了 Element Plus 的 Scrollbar 组件包裹。在页面内引入 Backtop 组件，未随着页面滚动生效
antd BackTop回到顶部 a-back-top回到顶部组件使用，a-back-top不显示，a-back-top无效问题
weixin_47602884的博客
09-15 1968
因为默认的是window，所以我们往往需要改变target的指向。有一天我需要用到 a-back-top回到顶部组件，在引用至页面中，发现无论何时都没有生效，就小小组件花了我中午宝贵的40分钟休息时间才弄好！1、target 设置需要监听其滚动事件的元素，值为一个返回对应 DOM 元素的函数。滚动高度达到此参数值才出现 ，而你的滚动还不到，所以可以把这个数据重新设置小点。2、 当第一步实现了，有可能你的页面上咋滚都没出现回到顶部那个按钮，这是因为你的。3、 放在任何地方都行，因为他。
Element-ui el-backtop不起作用的解决办法
yemuxia_sinian的博客
03-25 3780
其实主要问题在于target的设置，一开始看文档也是不清楚这个属性要怎么设置，有两种情况： 1、如果滚动条是整个document自身的那么此时target不用设置，如下即可： <template> Scroll down to see the bottom-right button. <el-backtop></el-backtop> </template> 2、如果此时页面的滚动条设置在了某个dom节点上（某个dom节点设置了overflow
Backtop 回到顶部失效? 手搓回到顶部按钮【基于vue自定义】
General_D的博客
05-21 1994
解决elemnt-ui的Backtop组件失效问题，两种方法帮你解决小烦恼~ 基于vue自定义一个回到顶部按钮，包含超视距显示、视距内隐藏、一键回到顶部，诸多丝滑小妙招等你来撩，阿巴阿巴~
el-backtop(返回顶部)
qq_38210427的博客
12-27 279
【代码】el-backtop(返回顶部)
el-backtop 使用
qq_22841387的博客
11-07 1563
问题描述 当我直接把element组件的backtop复制过来，没有出现 <el-backtop target=".page-component__scroll .el-scrollbar__wrap"></el-backtop> 解决方法 直接空的即可 <el-backtop> <div width="100%">回到顶部</div> </el-backtop> 实现效果 ...
el-backtop的使用
qq_41391569的博客
04-10 2240
官网代码不起作用还会报错 <el-backtop target=".page-component__scroll .el-scrollbar__wrap"></el-backtop> 改为 <el-backtop></el-backtop>
评论 1
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值