语义 UI 正则表达式解析器似乎无法正常工作

Semantic UI Regex parser does not seem to work correctly

在我的信用卡结帐表格中,我有以下内容:

    $('#checkout-info')
        .form({
            on     : 'blur',
            fields : {
                    id_cc_num : {   identifier: 'id_cc_num',
                                    optional: true,
                                    rules: []},
                    id_cc_CVC : {   identifier: 'id_cc_CVC',
                                    optional: true,
                                    rules: [{   type: 'regExp[/\d{3,4}/]',
                                                prompt: 'CVC must be three or four digits'}]},
                    id_cc_month : { identifier: 'id_cc_month',
                                    optional: true,
                                    rules: [{   type: 'integer[1..12]',
                                                prompt: 'MM must be a two-digit month designator - 01 thru 12'}]},
                    id_cc_year : {  identifier: 'id_cc_year',
                                    optional: true,
                                    rules: [{   type: 'integer[2016..2036]',
                                                prompt: 'Year must be at least 2016'}]},
            inline : 'true'
        });

除 regExp 验证外,显示的所有验证均正常工作。 regex /\d​​{3,4}/ 通过了 www.regexr.com 中的 regex 测试,但不会通过 Semantic regExp 测试。如果将 CVC 字段上的正则表达式替换为以下内容,则可以正常工作,但我更喜欢正则表达式的简洁性:

rules: [{   type: 'minLength[3]',
            prompt: 'CVC must be three or four digits'},
        {   type: 'maxLength[4]',
            prompt: 'CVC must be three or four digits'}]},

由于 regExp 表达式是字符串的一部分,您需要使用双反斜杠 \ 以及前导 ^ 和 [=16 来转义反斜杠=] 忽略在较大数字中找到的匹配模式。生成的模式将是:

'regExp[/^\d{3,4}$/]'

$(function() {
  $('#checkout-info').form({
    on: 'blur',
    fields: {
      id_cc_CVC: {
        identifier: 'id_cc_CVC',
        optional: true,
        rules: [{
          type: 'regExp[/^\d{3,4}$/]',
          prompt: 'CVC must be three or four digits'
        }]
      },
    },
    inline: 'true'
  });
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/semantic-ui/2.1.8/semantic.min.js"></script>
<link href="https://cdnjs.cloudflare.com/ajax/libs/semantic-ui/2.1.8/semantic.min.css" rel="stylesheet" />

<div class="ui container">
  <form class="ui form" id="checkout-info">
    <div class="field">
      <label for="id_cc_CVC">CVC</label>
      <input type="text" id="id_cc_CVC" />
    </div>
    <button type="button" class="ui button">Submit</button>
  </form>
</div>