Skip to content

[Bug Report]Ellipsis组件 on-hide 回调无效 #393

Open
@axu08

Description

@axu08

Environment

win11/Google Chrome127.0.6533.100

Reproduction link

https://run.iviewui.com/

Steps to reproduce

https://www.iviewui.com/view-ui-plus/component/layout/ellipsis 点击 “在 Playground 中打开” 输入以下代码:

<p class="ivu-m"><strong>显示 Tooltip</strong></p>

<Ellipsis :text="text" :length="100" tooltip />
<script> export default { data () { return { text: '史蒂夫·乔布斯(英语:Steve Jobs),是一名美国企业家、营销家和发明家,苹果公司的联合创始人之一,曾任董事长及首席执行官职位,NeXT创办人及首席执行官,也是皮克斯动画的创办人并曾任首席执行官,2006年为华特迪士尼公司的董事会成员。2017年9月苹果发布会举行的地方,以他命名为 Steve Jobs Theater 。' } } } </script>

What is expected?

触on-hide发事件

What is actually happening?

触on-show发事件

Activity

dosubot

dosubot commented on Oct 28, 2024

@dosubot

@axu08 你好! 我是Dosu,一个可以帮助你解决 bug、回答问题并成为贡献者的机器人。我会在等待人类维护者时帮助你。

The issue you're experiencing with the Ellipsis component's on-hide callback not being triggered might be related to how the component calculates whether the text exceeds the specified height. The on-hide event is emitted when the text content's height exceeds the specified height limit [1].

To troubleshoot this, ensure that the height of the Ellipsis component is set correctly and that the text indeed exceeds this height. If the text does not exceed the specified height, the on-show event will be triggered instead [1].

If the issue persists, you might want to check if there are any CSS styles affecting the component's height or if there are any other conditions in your environment that might affect the height calculation.

To continue talking to Dosu, mention @dosu.

axu08

axu08 commented on Oct 28, 2024

@axu08
Author
<script> 
    export default { 
        data () { 
            return { 
                text: '史蒂夫·乔布斯(英语:Steve Jobs),是一名美国企业家、营销家和发明家,苹果公司的联合创始人之一,曾任董事长及首席执行官职位NeXT创办人及首席执行官,也是皮克斯动画的创办人并曾任首席执行官,2006年为华特迪士尼公司的董事会成员。2017年9月苹果发布会举行的地方,以他命名为SteveJobs Theater 。' 
                   } 
        },
        methods: {
            ellipsisChange(v) {
                console.log(v)
            }
        }
    } 
</script>
<template>
	<div>
		<Ellipsis :text="text" :lines="2" @on-hide="ellipsisChange('h')" @on-show="ellipsisChange('s')"/>
    </div>
</template>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Metadata

Metadata

Assignees

No one assigned

    Labels

    BugSomething isn't working

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

      Development

      No branches or pull requests

        Participants

        @axu08

        Issue actions

          [Bug Report]Ellipsis组件 on-hide 回调无效 · Issue #393 · view-design/ViewUIPlus