Mirage学习笔记

饶骁
2023-12-01

前两个月因为工作变动开始接触到emberjs,由此接触到了mirage。
mirage是ember下的个api simulation。
mirage里的几个概念

  • factories
  • models
  • scenarios
  • serializers
  • config/routes

mirage和ember是紧密耦合的,从chnagelog里甚至能看到在早期mirage是app下面的一个子目录。另外mirage是stub server, 直接拦截了ember app发出的请求,应该是从适配器layer做了拦截。

config里配置mock的路由,类似于express的路由配置,但是其实不是一个真正的server。route里可以直接返回mock数据或者利用model返回。

this.get('/customer/accounts/:id', 'accounts');复制代码

model跟ember app的model不完全一样,这里只定义association。

#models/account.js
export default Model.extend({
  accountType: belongsTo('account-type'),
  individual: belongsTo()
})
#models/account-type.js
export default Model.extend({
  account: hasMany(),
})复制代码

这里belongsTo会让mirage自动去modes下找account-type文件,如果找不到,就会报错。

factory里定义每个字端的返回数据,感觉factory+model才是完整的model。这一层一般会用到faker这个模块,一个类似与mockjs的ember cli自带库。
factory里还可以利用aftercreate hook来生成关联模型的数据。

#factories/account.js
 export default Factory.extend({
   balance: faker.finance.amount,
   lastTransactionDate: faker.date.past,
   number: faker.random.number,
   name: faker.name.lastName,
   address1: faker.address.streetAddress,
   address2: faker.address.streetAddress,

   afterCreate: function(account) {
       account.create('account-type',account)
   }
})复制代码

这里的account-type是model的名字,同时也是文件名,因此mirage会去models或者factory下找accout-type的文件,如果找不到就会报错。

scenario是mock数据的最后一步,真正生成数据的地方。可以

#scenarios/default.js
server.create()
server.createList()复制代码

serializer是组织数据格式的地方,可以对mock data的key 和value 动手术。还可以为associated model加included.

#serializers/account.js
export default JSONAPISerializer.extend({
  include: ['individual','account-type']
});复制代码

这里的individual会对应与account model里定义的key,否则就没办法把individual关联到accout的include。

ps:
ember里会自动去转化camelCase和dashlize和underscore,但是不能太依赖这个。复制代码

举个例子:
app下的某route发出获取数据的请求:
this.get("store").findAll('post')
实际发出的api为:
${namespace}/posts

notes:
ember 会自动处理plura和singular复制代码

mirage会在adapter层去拦截,去config下找对应的路由,如果找到的话就会执行callback,其中的argumentschema包含所有model layer 定义的model,但这里要注意必须是plura,否则会报错

转载于:https://juejin.im/post/5a0859876fb9a0451e3f466b

 类似资料: