「这是我参与11月更文挑战的第22天，活动详情查看：2021最后一次更文挑战」
前言
在我们平常开发中，需要和用户交互的情况比比皆是：标题、名称，一般我们通过命令行交互的方式去询问我们的使用者，在Generator 中一般我们通过prompting方法
prompting 方法
prompting中我们会调用父类提供的prompt方法，这个方法中返回一个promise对象，也就是说他是一个Promise方法，你必须在你的任务中返回这个promise,以此保证它的完成之后,才进行下一个任务。
接收参数
参数文档
prompt方法接收一个数组参数
本次使用部分内容参数：
- type（类型）：（字符串）提示的类型。
- 默认值：
input - 可接受类型：
input,number,confirm,list,rawlist,expand,checkbox,password,editor
- 默认值：
- name（名称）:(字符串）在答案哈希中存储答案时要使用的名称。如果名称包含句点，它将定义答案哈希中的路径。
- message（消息）:(字符串|功能）要打印的问题。如果定义为函数，则第一个参数将是当前的查询会话答案。默认为名称的值（后跟冒号）。
- default（默认值）:(字符串| BOOLEAN |函数）如果输入NOLE或返回默认值的函数，则使用默认值。如果定义为函数，则第一个参数将是当前的查询会话答案。
返回类型Answers
Answers
A key/value hash containing the client answers in each prompt.
-
Key：去接与我们传入参数的name
-
Value (却决于输入)
confirm: (Boolean)input: 用户输入(如果定义了' filter '则过滤)(String)number: 用户输入(如果定义了filter，则过滤)(数字)rawlist,list: 选定的选择值(如果没有指定值，则为名称)(String)
演示代码
模板bar.html ：
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-1.0">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<title> <%= name %></title>
</head>
<body>
<h1><%= name %></h1>
</body>
</html>
有了这些之后，我们就可以使用我们传入的数据做为模板，那我们进行一些改造
prompting() {
return this.prompt([
{
type: 'input',
name: 'name',
message: '你的项目名称',
default: this.appname // appname 为项目生成目录名称
}
]).then( answers => {
// answers => { name: '用户输入的值'}
this.answers = answers
})
}
writing() {
// Yeoman 自动在生成文件阶段调用此方法
// 我们这里尝试往项目目录中写入文件
// this.fs.write(
// this.destinationPath('temp.txt'),
// Math.random().toString()
// )
// 模板文件路径
const tmpl = this.templatePath('bar.html')
// 输出目标路径
const output = this.destinationPath('bar.html')
// 模板数据上下文
const content = this.answers
this.fs.copyTpl(tmpl,output,content)
}
测试
我们再次进入我们需要链接的项目中运行：
yo sample
这时候会提示我们
在我们输入完毕我们的项目名称之后就会生成
完成！
小结
这个就是我们在yeoman中接受用户输入数据的方式，下一小节我们将要进入vue的脚手架编写了
