Home > Web Front-end > JS Tutorial > body text

What steps are needed to configure vue to request local json data?

php中世界最好的语言
Release: 2018-04-28 15:11:57
Original
1756 people have browsed it

This time I will bring you the steps required for vue configuration to request local json data. What are the precautions for vue configuration to request local json data. The following is a practical case, let's take a look.

Find the webpack.dev.conf.js file in the build folder, add

after const portfinder =

require

('portfinder') and then find devServer, Insert the following code:

 //然后找到devSeerver,在里面添加
  before (app) {
   app.get('/api/seller',(reg,res) => {
    res.json({
     errno: 0,
     data: seller
    }) // 接口返回json数据,上面配置的数据seller就复制给data请求后调用
   }),
   app.get('/api/goods',(reg,res) => {
    res.json({
     errno: 0,
     data: goods
    }) // 接口返回json数据,上面配置的数据goods就复制给data请求后调用
   }),
   app.get('/api/ratings',(reg,res) => {
    res.json({
     errno: 0,
     data: ratings
    }) // 接口返回json数据,上面配置的数据ratings就复制给data请求后调用
   })
  }
Copy after login

Request access

<script>
import header from './components/header/header.vue'
const ERR_OK = 0
export default {
 data () {
  return {
   seller: {}
  }
 },
 created () {
  this.$http.get('/api/seller').then((response) => {
   response = response.body; // 获取到数据
   if (response.errno === ERR_OK) {
    this.seller = response.data;
    console.log(this.seller);
   }
  })
 },
 components: {
  'v-header': header
 }
}
</script>
Copy after login

I believe you have mastered the method after reading the case in this article. For more exciting information, please pay attention to other related articles on the PHP Chinese website!

Recommended reading:

Detailed explanation of the steps to build the Koa project

JS implementation of text font printing interface

The above is the detailed content of What steps are needed to configure vue to request local json data?. For more information, please follow other related articles on the PHP Chinese website!

Related labels:
source:php.cn
Statement of this Website
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn
Popular Tutorials
More>
Latest Downloads
More>
Web Effects
Website Source Code
Website Materials
Front End Template
About us Disclaimer Sitemap
php.cn:Public welfare online PHP training,Help PHP learners grow quickly!