Fake data

2024-9-7 Less than 1 minute

http-request-mock has integrated with @ngneat/falso (opens new window).

You can use it to generate massive amounts of fake data.

  
Hit F12 to access Developer Tools and view the console logs.

# Mock data file

/**
 * @url https://www.api.com/faker
 * @method any
 */
const { faker } = require('http-request-mock/http-request-mock.js');
module.exports = function() {
  return {
    id: faker.incrementId(),
    name: faker.name(),
    age: 10 + faker.rand(0, 90),
    phone: faker.phone('(###) ###-####'),
    gender: faker.gender(),
    avatar: faker.avatar(),
  };
};

# Vue code

<template>
  <div class="demo">
    <button @click="get">GET https://www.api.com/faker</button>
    <pre class="result"> {{ msg }} </pre>
    <div class="tips">Hit F12 to access Developer Tools and view the console logs.</div>
  </div>
</template>

<script>
import axios from 'axios';
export default {
  data() {
    return { msg: '' }
  },
  methods: {
    get() {
      axios.get('https://www.api.com/faker').then(res => {
        this.msg = JSON.stringify(res.data, null, 4);
      });
    },
  }
}
</script>
<style scoped src="./demo.css">
Last update: September 7, 2024 15:58