IndexedDB的包装器JsStore - insert插入参数配置

        JsStore是IndexedDB的包装器。它提供了简单的SQL，如api，易于学习和使用。IndexedDb查询可以在web worker中执行，JsStore通过提供一个单独的worker文件来保留这个功能。

        Insert API用于在表中插入新记录，还可以为未在db模式中定义的列插入数据。JsStore保留了IndexedDb的NoSql功能。

insert API参数配置：

属性	描述
into	用于指定表的名称
values	用于指定要插入的数据。它接受一个数据数组。
return	是一个可选的&类型的布尔字段。它用于获取插入的数据。
upsert	如果存在则更新数据，否则插入。默认值为false。
validation	是否验证数据。缺省值为true。这可以用来加速插入查询。
skipDataCheck	不要检查或更改数据中的任何内容。缺省值为false。 如果提供true，这将直接插入数据，而不检查任何东西，如数据类型，自动增量等。这在你想要一次插入大量记录并且对模式没有任何约束的情况下是有用的。
ignore	发生错误时忽略记录。当您从用户或任何来源接收一些随机数据时。

一、搭建Demo

        首先还是搭建一个学生列表演示Demo，用来获取学生列表及新增功能页面。

1.1 安装

vue-cli全局安装

npm install -g vue-cli

初始化项目

vue init webpack example

其他插件就不细讲了，可以查看：https://blog.csdn.net/jiciqiang/article/details/115792838目录一、vue安装二、sass安装三、vuex安装四、vue-devtolls安装五、vue-ls安装一、vue安装1.vue-cli全局安装npm install -g vue-cli2.初始化项目vue init webpack projectName3.运行项目注：npm中-g, -d, -s区别1.-g 全局安装，全称--global2.-s 安装到dependencies中，用于生产环境，即--save3.-d 安装到devD.https://blog.csdn.net/jiciqiang/article/details/115792838

1.2 页面创建

        在src/pages/index目录中创建index.vue，代码如下：

<template>
  <div class="jsstore-insert-wrap">
    <el-form :inline="true" class="demo-form-inline">
      <el-form-item label="姓名">
        <el-input size="small" v-model="formData.name" placeholder="请输入姓名"></el-input>
      </el-form-item>
      <el-form-item label="年级">
        <el-input size="small" v-model="formData.grade" placeholder="请输入年级"></el-input>
      </el-form-item>
      <el-form-item label="地址">
        <el-input size="small" v-model="formData.address" placeholder="请输入地址"></el-input>
      </el-form-item>
      <el-form-item label="生日">
        <el-date-picker
            size="small"
            v-model="formData.birthday"
            type="date"
            placeholder="选择生日">
          </el-date-picker>
      </el-form-item>
      <el-form-item>
        <el-button size="small" type="primary">新增</el-button>
      </el-form-item>
    </el-form>

    <el-table :data="tableData" style="width: 100%">
      <el-table-column prop="name" label="姓名"></el-table-column>
      <el-table-column prop="grade" label="年级"></el-table-column>
      <el-table-column prop="address" label="地址"></el-table-column>
      <el-table-column prop="birthday" label="生日"></el-table-column>
    </el-table>
  </div>
</template>

<script>
  export