Blazorise RTE 验证

Question

我有一个来自 blazorise 的富文本编辑器，我正在尝试验证用户正在编写的输入。特别是不能为空。我创建了一个 TextEdit 不可见组件以获取该消息，但似乎未触发我对 textedit 的验证。我有一个流利的验证检查，而不是一个表格。

这是我在做什么：

<FieldLabel>Viber message:</FieldLabel>
                                <RichTextEdit @ref="rteViberBody"
                                              ContentChanged="@MyCheckRTEMethod"
                                              PlaceHolder="Type your message here..."
                                              ReadOnly="@readOnly"
                                              SubmitOnEnter="false"
                                              Style="height:80px">
                                    <Editor>
                                       
                                    </Editor>
                                    <Toolbar>
                                        <RichTextEditToolbarGroup Float="Float.End">                                               
                                            <RichTextEditToolbarButton Action="RichTextEditAction.Bold" />
                                            <RichTextEditToolbarButton Action="RichTextEditAction.Italic" />
                                            <RichTextEditToolbarButton Action="RichTextEditAction.Strike" />
                                            <RichTextEditToolbarButton Action="RichTextEditAction.Image" />
                                            <RichTextEditToolbarButton Action="RichTextEditAction.Clean" />
                                        </RichTextEditToolbarGroup>
                                    </Toolbar>
                                </RichTextEdit>
                            </Field>
                        </Fields>
                        <Fields>
                            <Field>
                                <Validation AsyncValidator="@ValidateRTEViberInputAsync">
                                    <TextEdit @bind-Text="viberMessageHiddenForValidation" @bind-Text:event="oninput" Visibility="Visibility.Invisible">
                                            <Feedback>
                                            <ValidationError>Please type a message.</ValidationError>
                                        </Feedback>
                                    </TextEdit>
                                </Validation>
                            </Field>

有人知道需要做什么或改变什么才能让它发挥作用吗？ 提前致谢

Answer 1

刚发现有人提议：https://github.com/Megabit/Blazorise/issues/1792

到目前为止有一个解决方法但不是很好：

<RichTextEdit @ref="richTextEditRef"
                ConfigureQuillJsMethod="blazoriseDemo.configureQuillJs"
                ContentChanged="@OnContentChanged"
                Border="@( string.IsNullOrWhiteSpace( contentAsText ) ? Border.Danger : null)">
      ...
  </RichTextEdit>
  @if ( string.IsNullOrWhiteSpace( contentAsText ) )
  {
      <Paragraph TextColor="TextColor.Danger">Text is empty</Paragraph>
  }
  else
  {
      <Paragraph TextColor="TextColor.Success">Text is valid</Paragraph>
  }
@code{
    private string contentAsText;

    public async Task OnContentChanged()
    {
        contentAsText = await richTextEditRef.GetTextAsync();
    }
}

Answer 2

解决方法，如果有人遇到类似的事情，请查看：https://github.com/Megabit/Blazorise/issues/1792#issuecomment-1369741666

<RichTextEdit @ref="richTextEditRef"                
ConfigureQuillJsMethod="blazoriseDemo.configureQuillJs"
            ContentChanged="@OnContentChanged"
            Border="@( string.IsNullOrWhiteSpace( contentAsText ) 

？ Border.Danger : null)"> ... @if ( string.IsNullOrWhiteSpace( contentAsText ) ) { 文字是 空的 } 别的{ 文字是 有效的 } @代码{ 私有字符串 contentAsText；

public async Task OnContentChanged()
{
    contentAsText = await richTextEditRef.GetTextAsync();
}
}