vue-router实现增删改查grud操作

代码语言:html

所属分类:布局界面

代码描述:vue-router实现增删改查grud操作

代码标签: 删改 grud 操作

下面为部分代码预览,完整代码请点击下载或在bfwstudio webide中打开

<!DOCTYPE html>
<html lang="en">

<head>

    <meta charset="UTF-8">



    <link type="text/css" rel="stylesheet" href="//repo.bfw.wiki/bfwrepo/css/bootstrap.3.3.4.css">

    <style>
        .logo {
            width: 50px;
            float: left;
            margin-right: 15px;
        }

        .form-group {
            max-width: 500px;
        }

        .actions {
            padding: 10px 0;
        }

        .glyphicon-euro {
            font-size: 12px;
        }
    </style>



</head>

<body>

    <div class="container">
        <header class="page-header">
            <div class="branding">

                <h1>Vue.js CRUD application</h1>
            </div>
        </header>

        <main id="app">
            <router-view></router-view>
        </main>
    </div>

    <template id="product-list">
        <div class="actions">
            <a class="btn btn-default" v-link="{path: '/add-product'}">
                <span class="glyphicon glyphicon-plus"></span>
                Add product
            </a>
        </div>
        <div class="filters row">
            <div class="form-group col-sm-3">
                <label for="search-element">Product name</label>
                <input v-model="searchKey" class="form-control" id="search-element" requred />
            </div>
        </div>
        <table class="table">
            <thead>
                <tr>
                    <th>Name</th>
                    <th>Description</th>
            .........完整代码请登录后点击上方下载按钮下载查看

网友评论0