svg.path.js如何根据鼠标移动绘制

JavaScript019

svg.path.js如何根据鼠标移动绘制,第1张

private void Form1_MouseClick(object sender, MouseEventArgs e)

{

MessageBox.Show(e.Location.ToString())

}

引导理解:sender 鼠标事件调用者

其相应参数( 鼠标点击数鼠标点击位置)

保存MouseEventArgs e 面

字面意思看 Mouse --- 鼠标 Event --- 事件 Args --- 参数(复数)

e.Location() 获取鼠标位置要获取X坐标使用 e.X

这几年后端的微服务是比较火爆,我们公司目前只要是新项目,基本上都是基于微服务去架构的,那么微前端是什么呢?

微前端是借鉴了微服务的架构理念,核心在于将一个庞大的前端应用拆分成多个独立灵活的小型应用,每个应用都可以独立开发、独立运行、独立部署,再将这些小型应用融合为一个完整的应用,或者将原本运行已久、没有关联的几个应用融合为一个应用。微前端既可以将多个项目融合为一,又可以减少项目之间的耦合,提升项目扩展性,相比一整块的前端仓库,微前端架构下的前端仓库倾向于更小更灵活

以前我们为了把几个独立运行的小型应用合并成一个应用都是通过iframe的方式去实现的,如果不考虑体验问题,iframe 几乎是最完美的微前端解决方案了。

iframe 最大的特性就是提供了浏览器原生的硬隔离方案,不论是样式隔离、js 隔离这类问题统统都能被完美解决。但他的最大问题也在于他的隔离性无法被突破,导致应用间上下文无法被共享,随之带来的开发体验、产品体验的问题

micro-app不是基于iframe架构的

micro-app提供了js沙箱、样式隔离、元素隔离、预加载、数据通信、静态资源补全等一系列完善的开箱即用功能

micro-app没有任何依赖

为了保证各个业务之间独立开发、独立部署的能力,micro-app做了诸多兼容,在任何技术框架中都可以正常运行。

下面我讲一下如何在Vue中使用micro-app

1、初始化一个基座应用

2、基座应用的文件修改

main.js修改

router.js修改

3、main-page.vue页面

4、创建一个子应用

5、子应用的router.js文件修改

6、src目录下新建 public-path.js

7、 main.js 引入public-path.js

到此这个简单的微应用就搭好了

觉得效果不错的请帮忙加个关注点个赞,经常分享前端实用开发技巧

javascript没有模块体系,无法将大程序分拆成互相依赖的小文件,再用简单的方法将它们拼装起来.为了解决这个问题,ES6推出了export和export default.

export和export default是es6提出来的,它在编译时就完成模块加载,export命令可以出现在模块的任何位置,只要处于模块顶层即可,如果处于块级作用域就会报错,import也是如此.

从上面图片我们可以看出export后面必须跟变量名和值,可以直接声明或写在一个对象中,都会以键值对的形式导出数据.

以上五种写法都可以,export default后面只能跟值.

总结:export后面必须有变量名和值,导出的数据是键值对形式,而export default后面只能是值,因为它已经有变量名default

require和module.exports是CommonJS规范,它是在运行时加载,就是说运行时才能得到这个对象,module.exports后面跟的值和export default一样

以上五种写法都可以

module.export可以用import来引入,后面可以跟大括号或不跟,跟的话相当于解构赋值,不跟就是整体引入,export也可以用require来引入.require('path.js')或import('path.js')都表示执行这个模块,不会返回值.

export一般导出方法,引入的时候使用大括号按需引入你需要的方法,export default导出对象或数组,比如接口api对象,routes路由数组,但是引入的时候会整体引入,module.exports一般导出对象,可以用import或require整体引入或按需引入,这样子比较灵活,所以module.exports和import使用的场景也挺多的,import只能写在js文件顶部,但是require可以写在任何地方,所以要根据场景不同使用不同方法.

总结:export后面跟变量名和值,import后面是{}或* as 变量名,export default后面跟值,import后面没有{},module.exports后面和export default一样都是值,require后面有{}表示解构赋值,没有表示整体引入,import和require都可以引入export和module.exports,import只能写在js文件顶部,但是require可以写在任何地方.CommonJS模块输出是一个值的拷贝,ES6模块输出是值的引用.CommonJS模块是运行时加载,ES6模块是编译时输出接口.