组件引用ViewRef

小于 1 分钟

组件引用ViewRef

在编写Kuikly页面时,你可能会有调用组件的公开方法的诉求, 此时你可以声明一个ViewRef变量,然后在声明组件时,调用ref{}闭包来初始化ViewRef。 有了ViewRef以后,你就可以调用组件的内部方法。举个例子: 我想调用List组件内部的setContentOffset方法

@Page("HelloWorldPage")
internal class HelloWorldPage : Pager() {
    
    lateinit var listViewRef: ViewRef<ListView<*, *>> // 1.声明ListView类型的ViewRef变量

    override fun body(): ViewBuilder {
        val ctx = this
        return {
            attr {
                backgroundColor(Color.WHITE)
            }
            
            event { 
                click { 
                    // 3.点击的时候, 调用List组件内的setContentOffset方法
                    ctx.listViewRef.view?.setContentOffset(0f, 100f)
                }
            }

            List { 
                ref { 
                    ctx.listViewRef = it // 2.在ref{}闭包内初始化ViewRef
                }
                attr { 
                    flex(1f)
                }
            }
        }
    }

在上述代码中,我们首先定义了一个类型为ViewRef变量,然后再List组件的ref{}闭包内初始化ViewRef, 最后在点击的时候,通过ViewRef拿到ListView,接着调用其setContentOffset方法

下一步

学习完Kuikly中的ViewRef后,我们接下来学习Kuikly中的组合组件ComposeView

上次编辑于: