Axios入门

Axios入门_第1张图片

Axios入门_第2张图片

Axios入门_第3张图片

DOCTYPE html>

<html lang="en">

<head>

    <meta charset="UTF-8">

    <meta name="viewport" content="width=device-width, initial-scale=1.0">

    <title>Documenttitle>

    <script src="../ajax/axios-0.18.0.js">script>

    <script src="../ajax/vue.js">script>

head>

<body>

    <div id="app">

        <table border="1" cellspacing="0" width="60%">

            <tr>

                <th>编号th>

                <th>姓名th>

                <th>用户名th>

                <th>邮箱th>

                <th>手机号th>

                <th>网站th>

                <th>城市th>

            tr>

            <tr align="center" v-for="(user, index) in emps">

                <td>{{index + 1}}td>

                <td>{{user.name}}td>

                <td>{{user.username}}td>

                <td>

                   {{user.email}}

                td>

                <td>{{user.phone}}td>

                <td>

                    {{user.website}}

                td>

  

                <td>

                    {{user.address.city}}

                td>

            tr>

                table>

    div>

body>

html>

  
  

<script>

    new Vue({

        el:"#app",

        data:{

            emps : []

        },

        mounted() {

            axios.get("https://jsonplaceholder.typicode.com/users").then(

                result => {

                    this.emps = result.data

                }

            )

        },

    })

script>

你可能感兴趣的:(前端,vue.js,javascript)