RadDataForm nativescript vue показать / скрыть пароль

Question

Имейте эту часть формы кода:

<RadDataForm id="loginForm" ref="loginForm" :source="user">
  <TKEntityProperty v-tkDataFormProperty name="password" displayName imageResource="res://lock" hintText="Password" index="0">
    <TKPropertyEditor v-tkEntityPropertyEditor type="Password">
      <TKPropertyEditorStyle v-tkPropertyEditorStyle labelWidth="4" />
    </TKPropertyEditor>
  </TKEntityProperty>
</RadDataForm>

Нужно добавить значок / изображение можно нажать, чтобы показать / скрыть пароль

Answer 1

Если я не ошибаюсь, CustomPropertyEditor еще не представлен как директива Vue в последней версии плагина nativescript-ui-dataform (на сегодняшний день v4.0.0).

Итаксначала вам нужно зарегистрировать его вместе с RadDataForm, может быть что-то вроде

import Vue from 'nativescript-vue';
import * as RadDataFormModule from "nativescript-ui-dataform";

import RadDataForm from "nativescript-ui-dataform/vue";
Vue.use(RadDataForm);

Vue.registerElement("TKCustomPropertyEditor", function () {
    return RadDataFormModule.CustomPropertyEditor;
});

Теперь просто используйте TKCustomPropertyEditor вместо TKPropertyEditor

        <TKEntityProperty v-tkDataFormProperty name="password">
            <TKCustomPropertyEditor v-tkEntityPropertyEditor
                @editorNeedsView="onPasswordEditorNeedsView">
            </TKCustomPropertyEditor>
        </TKEntityProperty>

Теперь вы можете создавать и назначатьвид, который вам нравится в событии editorNeedsView, как описано в документации.