cli3改版基本完成

Former-commit-id: 637e58a7d3aef389a4ea51c179aaee17f421f34c [formerly 637e58a7d3aef389a4ea51c179aaee17f421f34c [formerly 637e58a7d3aef389a4ea51c179aaee17f421f34c [formerly 637e58a7d3aef389a4ea51c179aaee17f421f34c [formerly fc66dcb2e437ff46b2c36ec1e3bcce71a6461250 [formerly b6451dc60d4c1e6006a9fcd380656d2023436e64]]]]]
Former-commit-id: c791410cda91e2df1b9808bfb032f0d3d68106ef
Former-commit-id: 0c5197800cfae6f27f7ab792c887fb25a73a23e0
Former-commit-id: 208a8e77c0fada6e9d191a7d495615ec2ef9704d [formerly af8c1367ed65b626196ac156c8521257cc804d60]
Former-commit-id: 1fdb571cea6ed9dba9ea02f4ba6ebfb5d89e1b2f
Former-commit-id: 774a145ae0694612edf988d9992ef797ddf4f21d
Former-commit-id: 03fc24d70365836d60360aa24e24dc7cb4520b91
Former-commit-id: bba4fd5552fa42da029fd6b310f5ee48558d5508
Former-commit-id: 2de81d34fb07248965677e8a3866c13089fa95e7

src/views/demo/plugins/better-scroll/to.vue

@@ -0,0 +1,106 @@
+<template>
+  <d2-container type="full">
+    <template slot="header">滚动定位</template>
+    <el-row :gutter="20">
+      <el-col :span="8">
+        <div ref="wrapper" class="demo-bs-wrapper">
+          <div>
+            <div v-for="n in 100" :key="n" class="demo-bs-item" :id="`demo-bs-item-${n}`">n : {{n}}</div>
+          </div>
+        </div>
+      </el-col>
+      <el-col :span="16">
+        <div class="d2-mb">
+          <p>滚动时间 ms</p>
+          <el-slider v-model="time" :min="100" :max="3000"></el-slider>
+        </div>
+        <div class="d2-mb">
+          <el-button-group>
+            <el-button @click="handleScrollTo(100)">滚动到100像素位置</el-button>
+            <el-button @click="handleScrollTo(300)">滚动到300像素位置</el-button>
+          </el-button-group>
+        </div>
+        <div class="d2-mb">
+          <el-button-group>
+            <el-button @click="handleScrollBy(50)">向下滚动50像素</el-button>
+            <el-button @click="handleScrollBy(-50)">向上滚动50像素</el-button>
+          </el-button-group>
+        </div>
+        <div class="d2-mb">
+          <el-button-group>
+            <el-button @click="handleScrollToElement(4)">滚动到第四个</el-button>
+            <el-button @click="handleScrollToElement(14)">滚动到第十四个</el-button>
+            <el-button @click="handleScrollToElement(24)">滚动到第二十四个</el-button>
+          </el-button-group>
+        </div>
+      </el-col>
+    </el-row>
+    <template slot="footer">
+      <d2-demo-link-btn title="文档" link="http://ustbhuangyi.github.io/better-scroll/doc/zh-hans/"/>
+    </template>
+  </d2-container>
+</template>
+
+<script>
+// 插件
+import BScroll from 'better-scroll'
+
+export default {
+  data () {
+    return {
+      time: 300,
+      BS: null
+    }
+  },
+  mounted () {
+    this.scrollInit()
+  },
+  beforeDestroy () {
+    this.scrollDestroy()
+  },
+  methods: {
+    handleScrollTo (y) {
+      this.BS.scrollTo(0, -y, this.time)
+    },
+    handleScrollBy (y) {
+      this.BS.scrollBy(0, -y, this.time)
+    },
+    handleScrollToElement (n) {
+      this.BS.scrollToElement(`#demo-bs-item-${n}`, this.time)
+    },
+    scrollInit () {
+      this.BS = new BScroll(this.$refs.wrapper, {
+        mouseWheel: true,
+        scrollbar: {
+          fade: true,
+          interactive: false
+        }
+      })
+    },
+    scrollDestroy () {
+      if (this.BS) {
+        this.BS.destroy()
+      }
+    }
+  }
+}
+</script>
+
+<style lang="scss" scoped>
+@import '~@/assets/style/public.scss';
+.demo-bs-wrapper {
+  height: 400px;
+  position: relative;
+  overflow: hidden;
+  border: 1px solid $color-border-1;
+  border-radius: 4px;
+  .demo-bs-item {
+    line-height: 40px;
+    padding-left: 10px;
+    border-bottom: 1px solid $color-border-4;
+    &:last-child {
+      border-bottom: none;
+    }
+  }
+}
+</style>