穷凶极恶丶带恶人

穷凶极恶丶带恶人 查看完整档案

珠海编辑深圳大学  |  软件工程 编辑  |  填写所在公司/组织填写个人主网站
编辑

正在学webpack/mock

个人动态

穷凶极恶丶带恶人 回答了问题 · 2020-09-11

解决当使用transform scale时,怎么确定其在页面中的位置

最后采用的方案是
1.移动时记录变换原点位置
2.根据scale的比例计算出左上角相对原点的位置
3.根据原点位置与左上角的相对位置,算出左上角的位置

关注 3 回答 3

穷凶极恶丶带恶人 提出了问题 · 2020-09-11

解决当使用transform scale时,怎么确定其在页面中的位置

我现在有张图片是可以拖拽移动和放大缩小的,在图片左上角有一段说明是动态显示信息的,必须且仅显示在图片的左上角。

<img
  :data-original="src"
  :width="picW"
  :height="picH"
  :style="{ transform: picTransform, top: picTop ,left:picLeft }"
  @mousedown.prevent="mousedown($event)"
  @mousemove.prevent="mousemove($event)"
  @mouseup.prevent="mouseup($event)"
  @mousewheel.prevent="mousewheel($event)"
  @load="onload"
>
<span 
:style="{ top: picTop ,left:picLeft,position:'absolute' }">
  {{ info }}
</span>

当图片放大缩小后,在页面效果中,其位置是有变化的,但是left和top值没变,那么图片放大缩小时,我该如何调整 span位置

关注 3 回答 3

穷凶极恶丶带恶人 回答了问题 · 2020-09-09

解决萌新求教:在javaweb实现单点登录系统有哪些方案?

git上搜一下,很多现成的方案

https://github.com/search?l=J...

关注 6 回答 4

穷凶极恶丶带恶人 回答了问题 · 2020-09-08

解决key()和push()不能连用吗?

搞那么复杂干嘛,换成这样写不好吗

this.Num.forEach(item=>{
    if (!this.Group.some(key => key.id === item.id)) {
        this.Group.push(item)
    }
})

关注 3 回答 1

穷凶极恶丶带恶人 赞了回答 · 2020-09-08

构造函数添加方法,为什么必须用.prototype往原型上添加方法,实例才能调用,否则undefined

学过 Java / C# / Golang 一类的 OOP 强类型语言吗?

这就是基本的静态方法和类方法的区别。

P.S. C# 3.0 后增加了可以在实例里访问静态方法的特性,但本质是个语法糖。

关注 1 回答 2

穷凶极恶丶带恶人 回答了问题 · 2020-09-08

解决webpack打包时cross-env 报错unexpected token ...

可能是webpack 没有配置babel

module: {
  rules: [
    {
      test: /\.js$/, 
      exclude: /node_modules/, 
      loader: "babel-loader" 
    } 
  ] 
}

关注 4 回答 2

穷凶极恶丶带恶人 回答了问题 · 2020-09-04

解决import 找不到文件,哪儿错了。。

少了个t

关注 3 回答 3

穷凶极恶丶带恶人 回答了问题 · 2020-09-03

解决室内地图、轨迹相关,前端需要采用什么技术

你是要画地图还是只要显示平面图中员工的相对位置就可以了

关注 5 回答 4

穷凶极恶丶带恶人 关注了问题 · 2020-09-03

解决室内地图、轨迹相关,前端需要采用什么技术

最近公司有准备做和物联网相关的项目,比如有厂房的平面图,员工会佩戴感应设备,一直上报位置信息,想知道在前端呈现方面一般会用到什么技术,看到网上一般讲 three.jswebgelesmap,现在对这块没有概念,各位大佬能否给指点一下,比如学习的话我应该如何起步?

关注 5 回答 4

穷凶极恶丶带恶人 发布了文章 · 2020-09-03

写了一个自动生成Vue+ElementUI增删改查代码的webpack插件

目的

为了解决简单的CURD动作,减少Ctrl+cCtrl+v动作,生成基础操作。一开始本打算写一个插件,后来发现不是很好扩展,且耦合性太强,各种个性化的需求太多,而Vue的继承并非很完善,尤其是Template的继承,干脆就采用生成代码的插件,简单暴力。
基于此目的,刚好学习一下webpack plugin开发。

开发

1. 定义插件入口,并合并配置参数

class CurdVueElementPlugin implements CurdVueElementPluginInterface {
  PluginParam: PluginParamInterface
  constructor(PluginParam: PluginParamInterface) {
    this.PluginParam = this.getOption(PluginParam)
  }
  apply(compiler: any) {
    compiler.plugin('environment', () => {
      this.execute()
    });
  }
  getOption(param: PluginParamInterface) {
    return Util.assign(DefaultPluginParam, param)
  }
  execute() {
    for (let opt of this.PluginParam.options) {
      let curdObj = new TemplateExecute(opt, this.PluginParam.baseDir)
      curdObj.execute()
    }
  }
}

2. 定义参数解析和根据模板写入文件的方法

class TemplateExecute {
  constructor(param: OptionInterface) {
    //……
  }
  getOption(param: OptionInterface) {
    //……
  }
  writeService(/*path*/,/*content*/) {
    return serviceTemplate.getTemplate().then((res: any) => {
      return Util.writeTemplate(/*path*/,/*content*/)
    })
  }
  writeView(/*path*/,/*content*/) {
     return Util.writeTemplate(/*path*/,/*content*/)
  }
  execute() {
    this.writeService(/*path*/,/*serviceTemplate*/).then( () => {
      this.writeView(/*path*/,/*viewTemplate*/);
    });
  }
}

3. 实现service模板内容的获取

4. 实现view模板内容的获取

然后搞定!

如何使用

安装

npm install curd-vue-element-plugin -D

配置

webpack配置文件中

const CurdVueElementPlugin = require('curd-vue-element-plugin')
module.exports = {
  plugins: [
    new CurdVueElementPlugin({
      //……options  
    })
  ]
}

Vue-Cli配置文件中

/* vue.config.js */
const CurdVueElementPlugin = require('curd-vue-element-plugin')
module.exports = {
  configureWebpack: {
    plugins: [
      new CurdVueElementPlugin({
        //……options
      })
    ]
  }
}

参数说明

{
  // `baseDir` 是要创建的文件根目录,默认为'./src'
  baseDir: './src', 
  // `options` 是要创建的增删改查实例配置组成的数组
  options: [{
    // `name` 是当前实例的名称,必填,其值对应最终生成的文件名
    name: 'project',
    // `serviceDir` 是请求代码生成目录,默认为'/services',
    serviceDir:'/services',
    // `componentDir` 是template代码生成目录,默认值是'/views'
    componentDir: '/views',
    // `service` 是要生成的增删改查功能配置数组,默认为['list']
    // 值只能为list,add,update,del 其他均不可识别。
    // 可阅读源码,在 `/lib/ServiceTemplate`中加入自定义的请求模板
    // 数组值可为字符串,也可为对象(如下所示):
    /*  { 
          // `func` 值与上述数组中值对应
          func:'list',
          // `url` 值为http请求地址
          url:'……'
        } */
    service: ['list', 'add', 'update', 'del'],
    // `component` 是定义实例对应的数据model等相关配置
    component: {
      // `primaryKey` 是数据主键,删除、修改需要识别此值,默认为 'id'
      primaryKey: 'id',
      // `model` 是数据模板,必填
      model: [{
        //`name` 是该项数据对应前后端交互时对应的数据项标识
        name: 'name',
        //`text` 是该项数据前端显示的名称
        text: '姓名',
        //`isSearch` 标识是否为查询条件,默认为 false
        isSearch: true,
        //`isEdit` 标识是否为编辑/新增列,默认为 true
        isEdit: true
      }, {
        name: 'sex',
        text: '性别'
      }, {
        name: 'telephone',
        text: '手机号码',
        isSearch: true
      }, {
        name: 'email',
        text: '邮箱'
      }, {
        name: 'address',
        text: '地址',
        isEdit: false
      }]
    }
  }]
}

Clone Demo 使用
项目源代码在这里:curd-vue-element-plugin

查看原文

赞 1 收藏 0 评论 2

认证与成就

  • 获得 22 次点赞
  • 获得 9 枚徽章 获得 1 枚金徽章, 获得 1 枚银徽章, 获得 7 枚铜徽章

擅长技能
编辑

开源项目 & 著作
编辑

(゚∀゚ )
暂时没有

注册于 2020-06-04
个人主页被 764 人浏览