wx-f2的插件使用方案
BugDongDong opened this issue · 4 comments
首部及导言
感谢f2开发者,我忠实粉,已在公司极力推广Ant系技术。
欢迎转载本文,请标注来处。
Scroll bar的使用及扩展
- 小程序新建终端,请自行学习终端方向知识。
- npm install @antv/wx-f2 --save
- 关闭微信小程序,使用编辑器打开node_modules/@antv/wx-f2/src/index.js。
- 注入代码
import F2 from '@antv/f2'; // 第一步:加载插件 ScrollBar const ScrollBar = require('@antv/f2/lib/plugin/scroll-bar'); // 第二步:注册插件 ScrollBar F2.Chart.plugins.register(ScrollBar); // 这里进行全局注册,也可以给 chart 的实例注册
5.node_modules@antv\wx-f2路径下,window可以使用git bash here,linux可以直接操作。
6.执行npm install、npm run build
7.完成后删除node_modules@antv\wx-f2\node_modules
8.重新打开微信小程序,开启npm使用功能,构建npm包。
9.此时Scroll bar已经被注册到F2中了,无需引入,直接使用。
10.PS:微信小程序Pan平滑仍存在bug,即使你引入了ScrollBar,也没法触发滑动。
使用逻辑
wx-f2实际上就是f2,只不过因为小程序的原因,新增了事件传导(touchStart、touchMove、touchEnd)。
使用小程序工具>构建npm时,没有引入ScrollBar,所以构建完成的f2及wx-f2都不会存在ScrollBar。
必须在构建前,提前修改wx-f2,剩下的事情交给微信开发工具即可。
首部及导言
感谢f2开发者,我忠实粉,已在公司极力推广Ant系技术。
欢迎转载本文,请标注来处。Scroll bar的使用及扩展
- 小程序新建终端,请自行学习终端方向知识。
- npm install @antv/wx-f2 --save
- 关闭微信小程序,使用编辑器打开node_modules/@antv/wx-f2/src/index.js。
- 注入代码
import F2 from '@antv/f2'; // 第一步:加载插件 ScrollBar const ScrollBar = require('@antv/f2/lib/plugin/scroll-bar'); // 第二步:注册插件 ScrollBar F2.Chart.plugins.register(ScrollBar); // 这里进行全局注册,也可以给 chart 的实例注册
5.node_modules@antv\wx-f2路径下,window可以使用git bash here,linux可以直接操作。
6.执行npm install、npm run build
7.完成后删除node_modules@antv\wx-f2\node_modules
8.重新打开微信小程序,开启npm使用功能,构建npm包。
9.此时Scroll bar已经被注册到F2中了,无需引入,直接使用。
10.PS:微信小程序Pan平滑仍存在bug,即使你引入了ScrollBar,也没法触发滑动。使用逻辑
wx-f2实际上就是f2,只不过因为小程序的原因,新增了事件传导(touchStart、touchMove、touchEnd)。
使用小程序工具>构建npm时,没有引入ScrollBar,所以构建完成的f2及wx-f2都不会存在ScrollBar。
必须在构建前,提前修改wx-f2,剩下的事情交给微信开发工具即可。
兄弟,能教教我嘛,碰到饼图的哪个报错,搞一天了,没搞定
所以通过你的方式构建就可以用ScrollBar了吗? 平滑还是有bug的问题是能用还是完全划不动
首部及导言
感谢f2开发者,我忠实粉,已在公司极力推广Ant系技术。
欢迎转载本文,请标注来处。Scroll bar的使用及扩展
- 小程序新建终端,请自行学习终端方向知识。
- npm install @antv/wx-f2 --save
- 关闭微信小程序,使用编辑器打开node_modules/@antv/wx-f2/src/index.js。
- 注入代码
import F2 from '@antv/f2'; // 第一步:加载插件 ScrollBar const ScrollBar = require('@antv/f2/lib/plugin/scroll-bar'); // 第二步:注册插件 ScrollBar F2.Chart.plugins.register(ScrollBar); // 这里进行全局注册,也可以给 chart 的实例注册
5.node_modules@antv\wx-f2路径下,window可以使用git bash here,linux可以直接操作。
6.执行npm install、npm run build
7.完成后删除node_modules@antv\wx-f2\node_modules
8.重新打开微信小程序,开启npm使用功能,构建npm包。
9.此时Scroll bar已经被注册到F2中了,无需引入,直接使用。
10.PS:微信小程序Pan平滑仍存在bug,即使你引入了ScrollBar,也没法触发滑动。使用逻辑
wx-f2实际上就是f2,只不过因为小程序的原因,新增了事件传导(touchStart、touchMove、touchEnd)。
使用小程序工具>构建npm时,没有引入ScrollBar,所以构建完成的f2及wx-f2都不会存在ScrollBar。
必须在构建前,提前修改wx-f2,剩下的事情交给微信开发工具即可。
希望能尽快解决该BUG,这个需求功能蛮重要的,涉及较多x轴显示的时候,需要用到ScrollBar来提高用户体验,希望能给出解决BUG的时间点,拜托大神些~~~
这个问题解决了?