@zhangqingcq/vgce 0.1.14 → 0.1.16
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +13 -3
- package/dist/style.css +1 -1
- package/dist/vgce.js +3545 -3491
- package/dist/vgce.umd.cjs +20 -20
- package/package.json +1 -1
- package/src/assets/base.less +32 -0
- package/src/components/svg-editor/center-panel.vue +17 -14
- package/src/components/svg-editor/right-panel.vue +2 -1
- package/src/components/svg-viewer.vue +74 -27
- package/src/components/vue3-ruler-tool.vue +9 -5
- package/src/config/types.ts +1 -0
- package/src/utils/index.ts +32 -14
- package/src/views/Preview.vue +1 -1
- package/types/index.d.ts +6 -2
package/README.md
CHANGED
@@ -141,11 +141,11 @@ or
|
|
141
141
|
```
|
142
142
|
// viewer
|
143
143
|
|
144
|
-
<
|
144
|
+
<SvgViewer :data="xxx">
|
145
145
|
<template #background>
|
146
146
|
<div style="height: 100%; width: 100%; background-color: red"></div>
|
147
147
|
</template>
|
148
|
-
</
|
148
|
+
</SvgViewer>
|
149
149
|
```
|
150
150
|
### 8.mqtt 通信
|
151
151
|
|
@@ -162,7 +162,17 @@ or
|
|
162
162
|
找到组件的id(可以用vue的computed计算一份deviceCode和id的映射关系存到一个对象里,这样在需要id时可直接在计算出的对象凭借deviceCode
|
163
163
|
直接取到),即可用setNodeAttrByID改变组件属性
|
164
164
|
|
165
|
-
### 9.
|
165
|
+
### 9.event 事件处理
|
166
|
+
- 编辑器内组件支持事件处理,首先在选中组件时,右侧“事件”菜单下,可以添加事件(1个或多个)
|
167
|
+
- 添加事件后可以选择事件类型、行为、条件(条件非必填)
|
168
|
+
- 事件类型即触发类型,现有“点击”和“值改变”,点击即组件被点击触发,值改变即组件向外部emit `on-change`事件(一般为自定义vue组件才具备这个能力)时触发
|
169
|
+
- 事件行为即事件出发后要执行的动作,现有“改变属性”、“执行 JavaScript”、“emit 事件”
|
170
|
+
- 改变属性即改变自身和其他组件(其他组件需指定id)属性,需要指定要改变的key和想设定的value,一次可改多个属性
|
171
|
+
- 执行 JavaScript即运行输入的js代码
|
172
|
+
- emit 事件即viewer向外emit `on-event`事件,并传递{event,target}数据,event即当前事件的详细数据,target即当前组件的详细数据
|
173
|
+
- 条件即事件触发的额外条件,现有“关系运算”,即组件自身属性在满足给出的选定情况下,可以触发事件
|
174
|
+
|
175
|
+
### 10. example 查看示例
|
166
176
|
|
167
177
|
- download [VGCE](https://github.com/RickyHeaven/VGCE.git) (下载项目)
|
168
178
|
|