【问题标题】:ListView.setClickable() doesn't work. (Nativescript-Vue)ListView.setClickable() 不起作用。 (Nativescript-Vue)
【发布时间】:2019-05-15 10:08:26
【问题描述】:

我正在编写 Nativescript-Vue 应用程序。

我有一个包含两个子组件的组件。 因此,当我点击放置在第二个按钮中的按钮时,我需要禁用放置在第一个按钮中的 ListView 的滚动。

所以我通过 "ref=" 获取了我的 ListView 元素并将其放入存储 (Vuex)

<ListView ref="listViewEl" ></ListView>
...
mounted() {
    store.commit('putElInStore', this.$refs.listViewEl)
}

...

putElInStore(state, element) {
    state.listViewEl = element
}

当我点击第二个子组件中的按钮时,我需要禁用 ListView 滚动。所以我使用 store.commit:

<Button @tap="disableListViewScrolling"></Button>
...
disableListViewScrolling() {
    store.commit('disableScrolling')
}

...

disableScrolling(state) {
    state.listViewEl.nativeView.android.setClickable(false)
}

所以在这种情况下我没有收到任何错误,但根本没有任何反应。它只是不起作用。

我也尝试使用 setEnabled(false) 代替。它有效,但不正确。

我错过了什么?我的错在哪里?

提前致谢。

【问题讨论】:

    标签: javascript listview nativescript nativescript-vue nativescript-telerik-ui


    【解决方案1】:

    应该不需要将元素存储在 Vuex 中。如果没有完整的代码,我将为您提供如何执行此操作的总体布局。

    <Parent>
        <childOne ref="listViewChild"></childOne>
        <childTwo @disableButtonTapped="$refs.listViewChild.disableClick()"></childTwo>
    </Parent>
    
    <childOne> 
       <ListView ref="list"></ListView>
    </childOne>
    
    <script>
    export defaults {
      methods: {
        disableClick () {
          this.$refs.list.nativeView.android.setClickable(false)
        }
      }
    }
    </script>
    
    <childTwo> 
       <Button @tap="$emit('disableButtonTapped')"></Button>
    </childTwo>
    

    显然这段代码并不准确。

    【讨论】:

    • 如果您需要完全禁用交互,您也可以使用:isUserInteractionDisabled="someProp" 来代替。然后你管理 prop 的交互状态,而不是通过 ref 切换它。
    猜你喜欢
    • 2019-12-25
    • 2020-06-03
    • 2020-08-07
    • 2019-09-04
    • 2019-08-09
    • 1970-01-01
    • 2020-11-02
    • 2020-08-05
    • 2019-07-13
    相关资源
    最近更新 更多