el-backtop不显示的问题

最新推荐文章于 2024-06-28 11:18:26 发布
最新推荐文章于 2024-06-28 11:18:26 发布
阅读量465 收藏 7
点赞数 9
文章标签： vue.js 前端 javascript
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/manonglanye/article/details/135482488
版权

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

解决方法是在el-backtop 标签中增加 target=".el-scrollbar__wrap"
<el-scrollbar>
  <!-- 一些其他代码 -->
  <el-backtop target=".el-scrollbar__wrap" :right="20" :bottom="10" />
</el-scrollbar>
manonglanye
关注
  • 9
    点赞
  • 踩
  • 7
    收藏
    觉得还不错? 一键收藏
  • 1
    评论
BackToTop “返回顶部” 页面组件
04-16
NULL 博文链接：https://newlinuxjava.iteye.com/blog/1779419
elementPlus——backtop 使用无效问题
qq_52065282的博客
06-27 320
没写target就出现了backtop不生效问题，加上target属性后就可以了。
Backtop 回到顶部失效? 手搓回到顶部按钮【基于vue自定义】
General_D的博客
05-21 996
解决elemnt-ui的Backtop组件失效问题，两种方法帮你解决小烦恼~ 基于vue自定义一个回到顶部按钮，包含超视距显示、视距内隐藏、一键回到顶部，诸多丝滑小妙招等你来撩，阿巴阿巴~
vue+element-ui 回到顶部组件backTop
weixin_42598901的博客
08-16 1万+
<template> <div class="wraper"> <template> Scroll down to see the bottom-right button. <el-backtop target=".wraper"> &l...
elementUI的el-backtop(返回顶部)不生效
weixin_54930261的博客
12-30 5155
这个是基础用法，自定义用法跟这个也差不多，就是中间加了些样式。看起来这个例子很简单对不对，按照最简单的原则拿过来就用，Ctrl+C到自己项目后就等着出现回到顶部按钮，结果实际结果却令我大失所望，直接报错了。，心想这下子应该是可以了吧。结果运行的时候错误是没有了，但是那个心心念念的回到顶部按钮怎么都出现不了，难道是我姿势不对？目前我采用的方法是简单粗暴的删除target不指定对象， 也是能显现按钮，并且回到顶部。既然给出了原因，那解决应该很简单，不是找不到这个样式吗，那我就在外层套个。的功能的时候遇到坑了。
解决ElementUI的el-backtop无效的问题
weixin_45714898的博客
06-29 5550
错误用法示例 1. 直接拷贝了elementui的示例代码，添加了bottom和visibility-height属性 2. 控制台报错Error in mounted hook: "Error: target is not existed: .page-component__scroll .el-scrollbar__wrap" 解决方法1 去掉target，直接使用el-backtop <template> <div id="app"> <d
el-backtop返回顶部的使用
敲代码无敌小奶龙的博客
08-26 754
el-backtop返回顶部的使用
Element Backtop回到顶部的具体使用
10-15
<el-backtop target=".page-component__scroll .el-scrollbar__wrap"></el-backtop> ``` 这里，`target`属性非常重要，它指定了当滚动到哪个元素时，`Backtop`按钮将会出现。在上面的例子中，当`.page-component...
react-backtop:宽度上的后盖组件仅对移动设备起作用
05-10
React后台 一个纯JavaScript <backtop>组件，用于响应。安装Ctrl+c(hahaha)用法var Backtop = React . createClass ( { // ......} ) ;React . render ( < Backtop> , document . getElementById ( 'top' )) ;ES6 我...
react-Back-To-Top:可自定义的自上而下的组件以进行React
05-26
从头到尾React可自定义的自上而下的组件以进行React安装 npm i react-back-to-top或者 yarn add react-back-to-top用首先导入项目： import BackToTop from 'react-back-to-top';使用的是JSX： <...
BackTop.vue
12-18
BackTop.vue
element ui backTop源码解析-逐行逐析
qq_42389674的博客
01-04 891
backtop 滚动到顶部 element ui 组件源码解析
记录一下el-backtop的使用方法
qq_49294271的博客
09-22 716
el-backtop，使得element-ui页面实现返回到顶部
Web前端篇——ElementUI的Backtop 不显示问题
u011391361的博客
01-03 1693
ElementUI的Backtop 不显示问题
element-ui 回到顶部组件el-backtop
热门推荐
01-06 1万+
参考： 1，https://blog.csdn.net/weixin_42598901/article/details/99674145 2，https://www.cnblogs.com/rogerwu/p/9543563.html 3，https://blog.csdn.net/qq_36070288/article/details/84765139 4，https://www.cnb...
el-backtop 使用
qq_22841387的博客
11-07 1493
问题描述 当我直接把element组件的backtop复制过来，没有出现 <el-backtop target=".page-component__scroll .el-scrollbar__wrap"></el-backtop> 解决方法 直接空的即可 <el-backtop> <div width="100%">回到顶部</div> </el-backtop> 实现效果 ...
el-backtop回到顶部组件使用问题汇总
hunt_er的博客
03-05 1846
这是官网的基础语法和教程 官方给出的使用只有一行代码，没有过多的解释。 而实际使用也确实如此，确实一行代码就可以用了。 但是，在使用时往往存在各种各样的问题，笔者在用这个组件时也踩了不少坑，多方测试，发现如下问题（报错问题不在本篇解决范围，按照报错提示解决就好了），汇总如下： 注意事项： 最常见的问题就是不能显示（没有反应），好像这个组件被隐藏了一样，折腾半天最后连组件长什么样都不知道，，，， 这里放一个图，这是组件默认的样子，我放在了dialog里。 代码如下： <el
Web前端篇——ElementUI之el-scrollbar + el-backtop + el-timeline实现时间轴触底刷新和一键返回页面顶部
u011391361的博客
01-04 2034
ElementUI之el-scrollbar + el-backtop + el-timeline实现时间轴触底刷新和一键返回页面顶部
Element 组件 | el-backtop 组件实现回到底部
最新发布
啥都要.
06-28 216
示例采用 Scrollbar + Backtop 组件实现，模拟异步获取数据后，根据滚动容器高度及滚动位置判断是否展示回到底部按钮。
button el-backtop 怎么调用
01-20
在使用 Vue.js 开发中，可以通过以下步骤来调用 el-backtop 组件： 首先，在 Vue 组件中引入 el-backtop 组件： ```javascript import { Backtop } from 'element-ui'; export default { components: { Backtop, }, // 其他代码 } ``` 然后在需要使用 el-backtop 的地方，可以直接在模板中引用它： ```html <template> <div> <backtop :right="100" :bottom="100" :visibility-height="200"></backtop> </div> </template> ``` 在这个例子中，我们通过 backtop 组件的属性设置了回到顶部按钮距离右侧和底部的距离，以及滚动条滚动多少才显示回到顶部按钮。 另外，还可以在页面中直接调用 el-backtop 组件的方法，来动态控制它的行为。比如： ```html <template> <div> <backtop ref="backtopBtn"></backtop> <button @click="handleBacktop">回到顶部</button> </div> </template> ``` ```javascript export default { methods: { handleBacktop() { this.$refs.backtopBtn.scrollTo(); }, }, // 其他代码 } ``` 通过以上的步骤，就可以在 Vue.js 中调用 el-backtop 组件，并根据需要来控制它的显示和行为。
评论 1
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值