有一个小问题,希望老师点拨一下

来源:8-7 Message 组件改进为函数调用形式

有没有没被占用的昵称

2021-11-10

老师,目前我有一个需求。
1.有一个容器,容器内需要展示多个小div
2.只有一行,超出将隐藏,显示更多按钮,然后点击更多显示剩余的
3.每个小div的长度是不确定的

根据这个需求,我查看了符合的腾讯云的控制台页面
我发现他的思路是这样的
他循环了小div两次,第一次是正常循环,超出就换行,但是他把这一次的容器设置成了透明的
第二次是真实看到的,也就是只有一行,剩余的通过点击更多来查看

我的疑问是,他是怎么知道哪些被换行了呢?或者说他的思路还不是我想的这样?
求老师点拨一下

链接地址 https://console.cloud.tencent.com/
图片描述
老师你看左上角的1,鼠标hover云产品,展开瀑布流
2.数表放在菜单上,会出现星星图标点一下,添加快捷。
快捷菜单会在云产品后面展示,如果展示不开会出现3那个点点点图标
3鼠标hover点点点,展示剩余的快捷菜单,如下图
图片描述

写回答

2回答

张轩

2021-11-12

同学你好 我斗胆猜测一下 计算哪些要被下拉应该是 js 的计算,如果你去看他的结构 会发现你描述的两个,一个是透明的完全的列表 一个是不完全的换行之前的列表 

//img.mukewang.com/szimg/618dcb590947a38b18180534.jpg

如果你用第一个列表去和第二个列表去做计算,(取第一个最后的大于第二个的那些元素),那么这些就是换行的元素,直接将它们添加到下拉菜单的结构上就可以了。

我认为这样可以完成这个需求,但是至于腾讯是不是采用这种方法,那么就要看源代码啦~

0
2
有没有没被占用的昵称
非常感谢!
2021-11-14
共2条回复

张轩

2021-11-11

同学你好 请问能否提供一下对应的腾讯云控制台的链接和截图? 我需要自己去看一下 试一下才能了解更多

0
1
有没有没被占用的昵称
老师老师,我又编辑了一下问题,链接和图片都有了,麻烦老师了
2021-11-11
共1条回复

Vue3 + TS 仿知乎专栏企业级项目

带你完成前后端分离复杂项目,率先掌握 vue3 造轮子技能

3142 学习 · 2313 问题

查看课程