Nativescript-Vue 移除 iOS ListView 点击颜色

Posted 2023-04-13

【中文标题】Nativescript-Vue 移除 iOS ListView 点击颜色

【英文标题】：Nativescript-Vue Remove iOS ListView tap color

【发布时间】：2019-05-20 11:30:31

【问题描述】：

如何更改列表项的点击颜色？我的应用程序是深色主题，因此当您单击单元格时，会出现非常难看的白色闪光。我尝试了以下方法：

组件

const ls  = this.$refs.list

ls.itemLoading=(args)=>
  const cell = args.ios;
  cell.selectionStyle = UITableViewCellSelectionStyle.UITableViewCellSelectionStyleNone;

 

我也在我的mounted 方法中尝试了一个具有 ListView 的组件

this.$refs.list日志：

 _uid: 20,
_isVue: true,
'$options':
 parent:
 _uid: 19,
_isVue: true,
'$options': [Object],
_renderProxy: [Object],
_self: [Circular],
'$parent': [Object],
'$root': [Object],
'$children': [Object],
'$refs': [Object],
_watcher: [Object],
_inactive: null,
_directInactive: false,
_isMounted: true,
_isDestroyed: false,
_isBeingDestroyed: false,
_events: [Object],
_hasHookEvent: false,
_vnode: [Object],
_staticTrees: null,
'$vnode': [Object],
'$slots': ,
'$scopedSlots': ,
_c: [Object],
'$createElement': [Object],
'$attrs': [Getter/Setter],
'$listeners': [Getter/Setter],
'$store': [Object],
_watchers: [Object],
_props: [Object],
clearHistory: [Object],
go: [Object],
_data: [Object],
clubs: [<…>

【参考方案1】：

为itemLoading使用事件绑定

html

<ListView ref="listview" @itemLoading="onItemLoading">

JS

onItemLoading: function(args) 
   const cell = args.ios;
   if (cell) 
     cell.selectionStyle = UITableViewCellSelectionStyle.UITableViewCellSelectionStyleNone;
   

【讨论】：

ListView Nativescript-Vue 上是否有该事件？在文档中它只有 itemTap 的事件：nativescript-vue.org/en/docs/elements/components/list-view

您可以在官方ListView docs 中查看所有事件列表，并遵循适合您框架的语法。

但是这些都是作为事件暴露在 ListView vue 组件上的吗？

是的，很明显。所有核心事件/api 都适用于 Vue。 NativeScript-Vue 只是核心组件的一个包装器，它使 Vue 开发人员可以轻松地重用他们的知识和花哨的框架功能。

谢谢！这对我来说并不明显，因为我只是查看仅列出了 Tap 事件的 nativescript-vue.org 文档。

【参考方案2】：

您的代码看起来不错。但是，你只是稍微偏离了一点。

您正在通过您的需求引用listview 模块。您需要在 ListView 的实例而不是模块上使用事件。

因此，在页面/组件的页面事件或 vue 生命周期事件中，您应该从模板中获取 ListView 的实例，然后像拥有它一样使用 itemLoading 事件。 ?

【讨论】：

我尝试将ref 添加到ListView 和mounted 我做了this.$refs.list.itemLoading=(args) ... 但没有运气

你真的可以注销list的实例来确认它是ListView吗？

我刚刚更新了<ListView ref="listview">返回的问题

ListView 是 this.$refs.list.nativeView 吗？我不知道 Vue，所以我不确定，之前看到过其他问题。