Vue 自动轮播/跑马灯插件——vue-seamless-scroll
chenxuan0000.github.io/vue-seamles…
a-table
// 移动中
this.moving = marker1.on('moving', function (e) {
// setPath: 设置组成该折线的节点数组
passedPolyline.setPath(e.passedPath)
// const length = e.passedPath.length
// let flag = true
// if (length === moveArr.length && flag) {
// that.$message.success('任务已完成', 1);
// const item = that.taskList.find(it => it.id === that.taskId)
// item.taskRate = 100
// that.realTimeTaskList.unshift(moment(Date.now()).format('YYYY-MM-DD') + ' ' + item.name + '任务已完成')
// flag = false // AMap.event.removeListener(that.moving);
// }
})
// 移动结束
this.moveend = marker1.on('movealong', function (e) {
const item = that.taskList.find(it => it.id === that.taskId)
item.taskRate = 100
that.realTimeTaskList.unshift(moment(Date.now()).format('YYYY-MM-DD') + ' ' + item.name + '任务已完成')
// console.log('end')
})
v2组件通信 transfer 子组件
<template> <a-transfer class="transferClass" :data-source="mockData" show-search :filter-option="filterOption" :target-keys="targetKeys" :render="item => item.title" @change="handleChange" @search="handleSearch" /></template> <script> export default { props: { mockData: { type: Array, default: () => [] }, targetKeys: { type: Array, default: () => [] } }, data() { return { }; }, mounted() { // this.getMock(); }, watch: { // mockData: { // deep: true, // immediate: true, // handler() { // this.targetKeys = this.mockData.map(it => it.key) // console.log(this.targetKeys) // } // } }, methods: { filterOption(inputValue, option) { return option.description.indexOf(inputValue) > -1; }, handleChange(targetKeys, direction, moveKeys) { console.log(targetKeys, direction, moveKeys); // this.targetKeys = targetKeys; this.$emit('xiangyingTargetKeys', targetKeys); // this.$emit('update:targetKeys', targetKeys); }, handleSearch(dir, value) { console.log('search:', dir, value); } } }; </script><style lang="less">.fileInfo { display: inline-block;}.fileInfo .ant-upload-list-item-info { display: none;}.clusterTable p { margin-bottom: 5px;}.transferClass { .ant-transfer-list { width: calc(50% - 20px); // width: 50%; height: 350px; border-color: #0c6476; } .ant-transfer-list-header { color: #fff; border-bottom-color: #0c6476; background: transparent; } .ant-transfer-list-content-item { color: #fff; } .ant-transfer-list-content-item:hover { background-color: transparent; } .ant-transfer-list-content > .LazyLoad { animation: normal; } .ant-transfer-operation { button, button:hover { background-color: #13A6C4; } i { color: #fff; } } .ant-transfer-list-search-action { top: 18px; }}</style>
父组件
<TransferCom :mockData="xiangyingData" @change-targetKeys="xiangyingTargetKeys = $event" :targetKeys="xiangyingTargetKeys"/>
<!-- @change-targetKeys="xiangyingTargetKeys = $event" :targetKeys.sync="xiangyingTargetKeys"-->
sheetjs 文件读取, 转json, 转html
import { read, utils } from 'xlsx';
async function readFile(url) { const f = await fetch(url); const ab = await f.arrayBuffer() const wb = read(ab); const ws = wb.Sheets[wb.SheetNames[0]] // console.log(utils.sheet_to_html(wb.Sheets[wb.SheetNames[0]])) utils.sheet_to_json(ws).forEach((it, index) => { if (index % 20 === 0) { moveArr.push([it['GPS经度（度）'], it['GPS纬度（度）']]) } })}
vue项目打包清除console.log的四种方法总结
第3种：
babel-plugin-transform-remove-console插件，配置在babel.config.js中，vue-cli5实测可行，vue-cli3,4也可行。（尝试后，谷歌浏览器控制台仅websocket的打印输出未清除，其他打印输出都是清除干净了的）
下载依赖
npm install babel-plugin-transform-remove-console -D
or
yarn add babel-plugin-transform-remove-console -D
babel.config.js中
const proPlugins = [];
// 判断环境
if (process.env.NODE_ENV === 'production') {
proPlugins.push('transform-remove-console');
}
module.exports = {
plugins: [...proPlugins],
};
/** 无人机
const IS_PROD = ['production', 'prod'].includes(process.env.NODE_ENV)// 打包清除控制台打印const plugins = []if (IS_PROD) { plugins.push('transform-remove-console')}// lazy load ant-design-vue// if your use import on Demand, Use this codeplugins.push(['import', { 'libraryName': 'ant-design-vue', 'libraryDirectory': 'es', 'style': true // `style: true` 会加载 less 文件}])module.exports = { presets: [ '@vue/cli-plugin-babel/preset', [ '@babel/preset-env', { 'useBuiltIns': 'entry', 'corejs': 3 } ] ], plugins}
**/
第4种：
不用插件，main.js中判断生产环境后window.console.log = function (){};即可，vue-cli5实测可行，vue-cli3,4也可行。（尝试出来的效果是清除得最干净的，但不清楚这种侵入式覆盖的写法有啥弊端没有）
main.js中
// 正式环境清除所有console.log
if (process.env.NODE_ENV === 'production') {
if (window) {
window.console.log = function () {};
}
}
