zoukankan      html  css  js  c++  java
  • 前后端数据接口对接练习

    练习要求:

    
    要求:
    1. 能实现前端增删查改省份信息的功能 
    
    ​       其中查询数据的时候,显示为案例中的表格格式。
    
    ​      注意,在drf中可以通过自定义请求头,实现cors,解决axios跨域问题。
    2.实现点击gdp表头信息,能够进行倒叙排序.
    
    
    | 省份编号 (id) | 省份 (name) | 占地面积 (area) | 人口 (population/亿) | 国民生产总值 (gdp/万亿) |
    | ------------- | ----------- | ----------------- | ---------------------- | ------------------------- |
    | 1             | 广东        | 17.98             | 1.12                   | 9.73                      |
    | 2             | 江苏        | 10.26             | 0.80                   | 9.26                      |
    | 3             | 山东        | 15.7              | 1.00                   | 7.65                      |
    | 4             | 浙江        | 10.18             | 0.57                   | 5.62                      |
    | 5             | 河南        | 16.7              | 0.96                   | 4.8                       |
    | 6             | 四川        | 48.5              | 0.83                   | 4.07                      |
    | 7             | 湖北        | 18.59             | 0.59                   | 3.94                      |
    | 8             | 湖南        | 21.18             | 0.69                   | 3.64                      |
    | 9             | 河北        | 19                | 0.75                   | 3.6                       |
    | 10            | 福建        | 12.14             | 0.39                   | 3.58        
    
                  |
    
    

    1.1搭建项目(ubuntu):

    终端操作(搭建前端项目):

    cd ./Desktop      //进入桌面
    moluo@ubuntu:~/Desktop$ mkvirtualenv homework      //创建虚拟环境
    (homework) moluo@ubuntu:~/Desktop$ mkdir homework      //在桌面创建目录
    (homework) moluo@ubuntu:~/Desktop$ cd homework/      //进入桌面
    (homework) moluo@ubuntu:~/Desktop/homework$ vue init webpack view      //创建前端项目
    ? Project name view
    ? Project description A Vue.js project
    ? Author Jerry
    ? Vue build standalone
    ? Install vue-router? Yes
    ? Use ESLint to lint your code? No
    ? Set up unit tests No
    ? Setup e2e tests with Nightwatch? No
    ? Should we run `npm install` for you after the project has been created? (reco
    mmended) npm....................            //创建ok
    // 搭建完后端在进前端run起来
    (homework) moluo@ubuntu:~/Desktop/homework$ cd view
    (homework) moluo@ubuntu:~/Desktop/homework/view$ npm run dev
    
    

    终端操作(搭建后端项目):

    Ctrl+Shift+T      //另起终端窗口搭建后端项目
    moluo@ubuntu:~/Desktop/homework$ workon homework
    (homework) moluo@ubuntu:~/Desktop/homework$ pip install django -i https://pipy.douban.com/simple
          //下载django
    (homework) moluo@ubuntu:~/Desktop/homework$ cd view
    (homework) moluo@ubuntu:~/Desktop/homework/view$ npm run dev   
    .................        
     DONE  Compiled successfully in 2699ms 
    

    这个色

    Ctrl+Shift+T      //另起终端窗口搭建后端项目
    moluo@ubuntu:~/Desktop/homework$ workon homework
    (homework) moluo@ubuntu:~/Desktop/homework$ pip install django -i https://pipy.douban.com/simple
          //下载django
    (homework) moluo@ubuntu:~/Desktop/homework$ cd view
    (homework) moluo@ubuntu:~/Desktop/homework/view$ npm run dev   
    .................        
     DONE  Compiled successfully in 2699ms 
    

    这个色

    Ctrl+Shift+T      //另起终端窗口搭建后端项目
    moluo@ubuntu:~/Desktop/homework$ workon homework
    (homework) moluo@ubuntu:~/Desktop/homework$ pip install django -i https://pipy.douban.com/simple
          //下载django
    (homework) moluo@ubuntu:~/Desktop/homework$ cd view
    (homework) moluo@ubuntu:~/Desktop/homework/view$ npm run dev   
    .................        
     DONE  Compiled successfully in 2699ms 
    
    变个色
    Ctrl+Shift+T      //另起终端窗口搭建后端项目
    moluo@ubuntu:~/Desktop/homework$ workon homework
    (homework) moluo@ubuntu:~/Desktop/homework$ pip install django -i https://pipy.douban.com/simple
          //下载django
    (homework) moluo@ubuntu:~/Desktop/homework$ cd view
    (homework) moluo@ubuntu:~/Desktop/homework/view$ npm run dev   
    .................        
     DONE  Compiled successfully in 2699ms 
    
  • 相关阅读:
    字符串替换
    字符串查找
    字符串比较
    字节与字符串相互转换
    1365. How Many Numbers Are Smaller Than the Current Number
    1486. XOR Operation in an Array
    1431. Kids With the Greatest Number of Candies
    1470. Shuffle the Array
    1480. Running Sum of 1d Array
    【STM32H7教程】第56章 STM32H7的DMA2D应用之刷色块,位图和Alpha混合
  • 原文地址:https://www.cnblogs.com/Python-368/p/12900860.html
Copyright © 2011-2022 走看看