I'm writting Nativescript-Vue app.
I have a component with two child components in it. So when I'm tapping a button placed in the second one, I need to disable scrolling of ListView placed in the first one.
So I took my ListView element via "ref=" and put it in store (Vuex)
<ListView ref="listViewEl" ></ListView>
...
mounted() {
store.commit('putElInStore', this.$refs.listViewEl)
}
...
putElInStore(state, element) {
state.listViewEl = element
}
I need to make ListView scrolling disabled when I'm tapping a button in the second child component. So I do it using store.commit:
<Button @tap="disableListViewScrolling"></Button>
...
disableListViewScrolling() {
store.commit('disableScrolling')
}
...
disableScrolling(state) {
state.listViewEl.nativeView.android.setClickable(false)
}
So I don't get any errors in this case, but there is no any reaction at all. It just doesn't work.
I also tried using setEnabled(false) instead of. It works, but incorrectly.
What do I miss? Where is my mistake?
Thanks in advance.
There shouldn't be any need to store the element in Vuex. Without the full code I'll give a you a general layout of how this could be performed.
<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>
Obviously this code isn't exact.