vue 는 ajax 를 사용 하여 배경 데 이 터 를 가 져 와 표시 합 니 다.

/span>html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Titletitle>
    <script src="/vue.min.js">script>
    <script src="/vue-resource.min.js">script>
    <style>
        #th th{
            background-color: #50a9fa;
            color: aliceblue;
            font-size: large;
        }
    style>
head>
<body >
<div id="app" align="center">
    <input type="text" v-model="id">
    <input type="text" v-model="pname">
    <button @click="addData">    button>
    <table id="th" border="1"solid width="400px">
        <tr>
            <th>  th>
            <th>  th>
            <th>  th>
            <th>  th>
        tr>
        <tr v-for="item in list ">
            <td>{{item.id}}td>
            <td>{{item.name}}td>
            <td>{{item.ctime}}td>
            <td>
                <a href="javascript:void(0)" >  a>
            td>
        tr>
    table>
div>
<script>
    //vue     
    
    new Vue({
       el:'#app',
        data:{
           list:[]
        },
        //vue                    
        //                          created  
        created:function () {
          this.getlist();//        ，vue                
        },
        methods:{
            getlist:function () {
                //      api          
                this.$http.get('http://vueapi.ittun.com/api/getprodlist').then(function (response) {
                    //           
                    if(response.body.status!=0)
                    {
                        alert(response.body.message);
                        return ;
                    }
                    //           
                    this.list=response.body.message;
                    
                });
                

            }
            
        }
    });
script>
body>
html>

이 내용에 흥미가 있습니까?

현재 기사가 여러분의 문제를 해결하지 못하는 경우 AI 엔진은 머신러닝 분석(스마트 모델이 방금 만들어져 부정확한 경우가 있을 수 있음)을 통해 가장 유사한 기사를 추천합니다:

Vue 페이지 수동 새로 고침, 탐색 표시줄 활성화 항목을 초기 상태로 복원

장면 설명: 페이지에 맨 위 네비게이션과 왼쪽 네비게이션이 존재하고 왼쪽 네비게이션과 오른쪽 내용 구역은 명명 보기를 사용하여 실현된다. 왼쪽 네비게이션의 링크를 클릭하면 오른쪽 내용 구역은 서로 다른 구성 요소의 ...

텍스트를 자유롭게 공유하거나 복사할 수 있습니다.하지만 이 문서의 URL은 참조 URL로 남겨 두십시오.

CC BY-SA 2.5, CC BY-SA 3.0 및 CC BY-SA 4.0에 따라 라이센스가 부여됩니다.

vue 는 ajax 를 사용 하여 배경 데 이 터 를 가 져 와 표시 합 니 다.

좋은 웹페이지 즐겨찾기