Идеи

Эта система генератора кода состоит из трёх частей: модели данных, шаблона и соединителя. Пользователь может определить свою собственную модель данных, правила и создать собственный шаблон в соответствии с этими правилами. Я думаю, что лучший шаблон — это собственный шаблон пользователя, потому что он лучше всего знает свои требования.

Наконец, пользователь может использовать соединитель для объединения модели данных и шаблона вместе для генерации кода.

Шаблон

Грамматика Это похоже на Razor. Я прочитал исходный код Vash (https://github.com/kirbysayshi/vash), его фокус — генерация HTML-файла, поэтому он будет форматом шаблона, но для генератора кода я сосредоточусь на формате кода, поэтому я переработал новый механизм шаблонов, используя код лексера из Jade, как это сделал Vash.

1. Выходной код означает, что он будет генерировать текст, используйте @(<code>). Например: @(model.name).
2. Логический блок кода использует @{<code>}. Пример:

   @{
       let pName = ng.toPascalCase(name);
   }
3. Встроенный текст использует @:<text>\n, выходной текст не заканчивается на \n.
4. Текстовый блок использует @:{<text>@:}.
5. Экранирование использует @@ вместо @.
6. Усечение, @!, если вы хотите вывести встроенный текст {xxx}, вы будете использовать @:{xxx}, но @:{ означает начало логического блока кода, так что вы можете добавить усечение, например, @:@!{xxx} для вывода {xxx}.

Дополнительные примеры Шаблон for:

@{
    if(model && model.arr && model.arr.length){
        for(let i in model.arr){
            let item = model.arr[i];
            let split = i == 0 ? '' : (model.split || '');
@(split)@(ng.include(model.template, item))
        }
    }
}

Макет В настоящее время не реализована главная страница, поскольку я не думаю, что она сильно поможет.

Подшаблоны Подшаблон использует ng.include(<путь к файлу подшаблона>, <модель>).

Заполнитель Заполнитель генерирует текст в последний момент, он будет заменён, когда весь шаблон завершит своё создание.

1. Используйте @[<placeholderName>] для установки заполнителя.
2. Используйте @[<placeholderName>(,<tag>)]{<code>} для определения содержимого заполнителя.
   • Тег внутри заполнителя Если вы не использовали tag в заполнителе, он добавит текст к заполнителю. Например, если существует @[p] в шаблоне и мы определили его содержимое в двух местах шаблона:

@[p]{
@:paragraph1
}
@[p]{
@:paragraph2
}

В конце концов мы получим текст paragraph1paragraph2 в позиции @[p]. Если мы используем тег в заполнителе, один и тот же тег будет добавлен только один раз. Например:

@[p,tag1]{
@:paragraph1
}
@[p,tag1]{
@:paragraph2
}
@[p,tag2]{
@:paragraph3
}

Мы получим текст paragraph1paragraph3 в @[p], второй будет проигнорирован.

Обтекание и отступ Мы можем добавить пробел к ng.include и @[<placeHolderName>], чтобы переключить режим, подробности см. ниже:

• ng.include Например:

<Form.Item label="@(model.display)" {...formItemLayout}>
    {getFieldDecorator('@(model.name)', {
        rules: [@(ng.include(' for', {arr: model.rules, template: 'frontend/create/rule', split: ',\n'}))]
    })(
        <Input @(model.isPassword ? ' type="password"' : '')
            placeholder="@(model.display)"
        />
    )}
</Form.Item>

Код ng.include(' for' добавляет пробел перед «путем к файлу подшаблона», поэтому вывод будет:

<Form.Item label="Name1" {...formItemLayout}>
    {getFieldDecorator('ccc', {
        rules: [{required: true, message: 'Must required'},
        {validator: this.emailValidate, message: 'Must be email format'}]
    })(
        <Input 
            placeholder="Name1"
        />
    )}
</Form.Item>

Если мы удалим пробел:

<Form.Item label="@(model.display)" {...formItemLayout}>
    {getFieldDecorator('@(model.name)', {
        rules: [@(ng.include('for', {arr: model.rules, template: 'frontend/create/rule', split: ',\n'}))]
    })(
        <Input @(model.isPassword ? ' type="password"' : '') ```
<Form.Item label="Name1" {...formItemLayout}>
    {getFieldDecorator('ccc', {
        rules: [{required: true, message: 'Обязательно'},
                {validator: this.emailValidate, message: 'Должен быть формат электронной почты'}]
    })(
        <Input 
            placeholder="Name1"
        />
    )}
</Form.Item>

Это значит, что если мы добавим пробел в начале пути суб-шаблона, при переносе отступ будет установлен на часть строки пробела; Если нет, то при переносе отступ будет установлен на текстовую часть.

import {
    Form@[ antd]
} from 'antd';

Определяет заполнитель как @[antd].

@[antd,input]{@:{,
Input@:}}

Если есть пробел, он выведет:

import {
    Form,
    Input
} from 'antd';

Если удалить пробел:

import {
    Form@[antd]
} from 'antd';

Результат будет выглядеть так:

import {
    Form,
        Input
} from 'antd';

Модель

Не стесняйтесь определять пользовательскую модель данных JS, а также правила.

Встроенные свойства

Модель данных

Поля модели данных

Для типа объекта _ref: если вы определили ref: '<filePath>' (здесь <filePath> — это относительный путь к каталогу модели данных), свойство _ref будет указывать на конкретную модель данных.

class OrderDetail{
    ccc = {
        display: 'Name1',
        ref: 'order-manage/test.js',
        rules:[{type: 'required', message: 'Must required'},{type: 'email', message: 'Must be email format'}]
    }
}

module.exports = OrderDetail;

Конфигурация (включая коннектор)

Структура данных возвращаемого объекта коннектора

Область видимости scope поддерживает древовидный режим, разделяемый на ., например, root может содержать root.module1 и root.module1.module1_1, если вы определили @[p]{<code>} в шаблоне

Примечание: данный текст является переводом исходного текста запроса. сcope root.module1, тогда в шаблоне области видимости root можно использовать контент для плейсхолдера @[p].