使用 Yeoman Generator 重复提示

Question

我正在创建一个 Yeoman Generator 来自动创建几个数据库表。我需要向用户提供添加多列的提示（下面是 ColumnName 和 DataType 的组合）。

我有一个模板保存在我的磁盘中，我在其中绑定了来自用户输入的动态名称，并基于此模板，最终脚本由 Yeoman Generator 生成。您能否建议如何提示用户输入他想输入的 ColumnName/DataType 的重复组合？

var prompts = [{
    type: 'input',
    name: 'name',
    message: 'The Table Name?'
  }, {
    type: 'input',
    name: 'attributeName',
    message: 'Define your Schema - ColumnName?',
    default: 'ID'
  },{
    type: 'input',
    name: 'attributeType',
    message: 'Define your Schema - DataType?',
    default: 'S'
  }
];


  return this.prompt(prompts).then(function (props) {
    this.props = props;
  }.bind(this));

模板内容——用户可以输入 1/2/3/4 或更多列的详细信息，一旦他这样做，下面的模板应该足够智能，可以创建这么多列组合键。

{
  "Type" : "AWS::Table",
  "Properties" : {
    "AttributeDefinitions" :  
          {
            "AttributeName" : "<%= attributeName %>",
            "AttributeType" : "<%= attributeType %>"
          },
          {
            "AttributeName" : "<%= attributeName %>",
            "AttributeType" : "<%= attributeType %>"
          },
    "TableName" : <%= name %>,

    }
}

Answer 1

您可以在prompting()钩子内添加递归函数。必须确保递归函数返回，this.prompts否则执行可能会停止。

我的策略如下

• 声明一个基于输入之一重复的递归函数

• 在递归时填充道具 this.columns

• 将此实例变量传递给writing()钩子中的模板

• 迭代this.columns模板中的 并填充您的列

• 第一个条目this.columns将包含表名和第一列详细信息

检查下面的代码，只要按预期调用递归函数，您就可以根据需要对其进行调整。

有一个额外的提示，询问是否重复。它也可以用一些逻辑丢弃，但这取决于你。

提示（）

prompting() {
  // Have Yeoman greet the user.
  this.log(yosay(
    'Welcome to the remarkable ' + chalk.red('generator-react-starter-kit-relay-container') + ' generator!'
  ));

  const tableNamePrompt = [{
    type: 'input',
    name: 'name',
    message: 'The Table Name?'
  }];

  const columnPrompts = [{
    type: 'input',
    name: 'attributeName',
    message: 'Define your Schema - ColumnName?',
    default: 'ID'
  }, {
    type: 'input',
    name: 'attributeType',
    message: 'Define your Schema - DataType?',
    default: 'S'
  }, {
    type: 'confirm',
    name: 'repeat',
    message: 'Do you want to add more columns?',
    default: 'Y'
  }]

  this.columns = [];

  const loop = (relevantPrompts) => {
    return this.prompt(relevantPrompts).then(props => {
      this.columns.push(props);

      return props.repeat ? loop(columnPrompts) : this.prompt([]);

    })
  }

  return loop([...tableNamePrompt, ...columnPrompts]);
}

然后在writing()钩子中传递columns您之前填充的实例变量。

写作（）

writing() {
  this.fs.copyTpl(
    this.templatePath('Schema.json'),
    this.destinationPath('./Schema.json'),
    {
      columns: this.columns
    }
  );
}

模板

{
  "Type" : "AWS::Table",
  "Properties" : {
    "AttributeDefinitions" : [
      <% for (let i=0; i<columns.length; i++) { %>
        {
          "AttributeName": "<%= columns[i].attributeName %>",
          "AttributeType": "<%= columns[i].attributeType %>"
        }
      <% } %>
    ],
    "TableName" : "<%= (columns[0] || {}).name %>"
  }
}

样品输入

     _-----_     ????????????????????????????
    |       |    ?      Welcome to the      ?
    |--(o)--|    ?        remarkable        ?
   `---------´   ? generator-react-starter- ?
    ( _´U`_ )    ?    kit-relay-container   ?
    /___A___\   /?        generator!        ?
     |  ~  |     ????????????????????????????
   __'.___.'__   
 ´   `  |° ´ Y ` 

? The Table Name? User
? Define your Schema - ColumnName? ID
? Define your Schema - DataType? Bigint
? Do you want to add more columns? Yes
? Define your Schema - ColumnName? Email
? Define your Schema - DataType? String
? Do you want to add more columns? Yes
? Define your Schema - ColumnName? Password
? Define your Schema - DataType? Text
? Do you want to add more columns? No

输出

{
  "Type" : "AWS::Table",
  "Properties" : {
    "AttributeDefinitions" : [

        {
          "AttributeName": "ID",
          "AttributeType": "Bigint"
        }

        {
          "AttributeName": "Email",
          "AttributeType": "String"
        }

        {
          "AttributeName": "Password",
          "AttributeType": "Text"
        }

    ],
    "TableName" : "User"
  }
}