字段电子邮件中的 RadDataForm 小写答案

【问题标题】：RadDataForm lowercase in field email字段电子邮件中的 RadDataForm 小写
【发布时间】：2019-10-18 18:38:51
【问题描述】：

在现场电子邮件中：

<TKEntityProperty v-tkDataFormProperty name="email" displayName imageResource="res://user" hintText="Email" index="0">
  <TKPropertyEditor v-tkEntityPropertyEditor type="Email">
    <TKPropertyEditorStyle v-tkPropertyEditorStyle labelWidth="4" />
  </TKPropertyEditor>
  <TKEmailValidator v-tkEntityPropertyValidators errorMessage="Invalid email"></TKEmailValidator>
</TKEntityProperty>

可以在 Nativescript 的 RadDataForm 中设置 autocapitalizationType="none" 吗？

【问题讨论】：

你能解释清楚吗
每次数字首字母大写时，我要小写。
尝试 type='url' 或类似的东西。它必须有效，如果它不起作用，那么下面是详细的答案。

标签： nativescript nativescript-vue

【解决方案1】：

我只是想发布一个答案，该答案还展示了如何更改 Android 和 iOS 的键盘，以防它对任何人有所帮助。我正在使用带有 Angular 和 TypeScript 的 NativeScript 7（但您也可以只使用常规 JavaScript），并且我通过访问在 RadDataForm 下使用的 iOS 和 Android 的本机元素使其工作。我还能够找出 TypeScript 的类型，很高兴看到所有不同的 InputType 可用*：

<RadDataForm [source]="item" (editorUpdate)="onEditorUpdate($event)">
    <TKEntityProperty tkDataFormProperty name="description"></TKEntityProperty>
</RadDataForm>

import { DataFormEventData } from 'nativescript-ui-dataform';
import { ios } from '@nativescript/core/application';

// ... inside an Angular component
  public onEditorUpdate(dataFormEvent: DataFormEventData): void {
    if (dataFormEvent.propertyName === 'descriptionProperty') {
      if (ios) {
        const iosTextField = dataFormEvent.editor as UITextField;
        iosTextField.autocapitalizationType = UITextAutocapitalizationType.None;  // "Sentences", "Words", "AllCharacters", or "None"
        iosTextField.autocorrectionType = UITextAutocorrectionType.Yes;  // "Yes", "No", or "Default"
      } else {
        const textEditor = dataFormEvent.editor as com.telerik.widget.dataform.visualization.editors.DataFormTextEditor;
        const androidEditText = textEditor.getEditorView() as android.widget.EditText;
        androidEditText.setInputType(android.text.InputType.TYPE_TEXT_VARIATION_NORMAL);  // Many difference choices see Android docs: https://developer.android.com/reference/android/text/InputType
      }
    }
  }

*Android InputType 选项，请参阅 Android 文档：https://developer.android.com/reference/android/text/InputType

【讨论】：

【解决方案2】：

截至今天，它是一个open feature request，您可能想要支持该问题并在那里跟进。

您仍然可以访问本机编辑器对象并关闭自动大写。

<template>
    <Page class="page">
        <ActionBar title="Home" class="action-bar" />
        <RadDataForm :source="person" @editorUpdate="onEditorUpdate">
            <TKEntityProperty v-tkDataFormProperty name="email">
                <TKPropertyEditor v-tkEntityPropertyEditor type="Email">
                    <TKPropertyEditorStyle v-tkPropertyEditorStyle />
                </TKPropertyEditor>
            </TKEntityProperty>
        </RadDataForm>
    </Page>
</template>

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

    import * as application from "tns-core-modules/application";

    export default {
        data() {
            return {
                person: {
                    email: ""
                }
            };
        },
        methods: {
            onEditorUpdate: function(args) {
                if (args.propertyName === "email") {
                    if (application.ios) {
                        args.editor.editor.autocapitalizationType =
                            UITextAutocapitalizationType.None;
                    }
                }
            }
        }
    };
</script>

Playground Sample

我认为您的问题应该只在 iOS 上，在 Android 上默认为小写。

【讨论】：