* 将部分 wx-xxx 组件转换成普通 dom 节点
(wxComponentName, options, tree)
| 37 | * 将部分 wx-xxx 组件转换成普通 dom 节点 |
| 38 | */ |
| 39 | function transformWxComponent2Dom(wxComponentName, options, tree) { |
| 40 | let groupEvent = null |
| 41 | if (wxComponentName === 'radio' || wxComponentName === 'checkbox') { |
| 42 | options.attrs.type = wxComponentName |
| 43 | wxComponentName = 'input' |
| 44 | } else if (wxComponentName === 'radio-group' || wxComponentName === 'checkbox-group') { |
| 45 | groupEvent = wxComponentName.split('-')[0] |
| 46 | wxComponentName = 'div' |
| 47 | } |
| 48 | options.tagName = wxComponentName |
| 49 | delete options.attrs.behavior |
| 50 | const normalElement = CONSTRUCTOR_MAP[wxComponentName.toUpperCase()] || Element |
| 51 | const element = normalElement.$$create(options, tree) |
| 52 | |
| 53 | if (groupEvent) { |
| 54 | // group 组件转成 div，监听底下的表单组件来做处理 |
| 55 | element.addEventListener('change', evt => { |
| 56 | if (!evt.$$isGroup) evt.stopImmediatePropagation() |
| 57 | }) |
| 58 | element.addEventListener(`$$${groupEvent}Change`, evt => { |
| 59 | const detail = {} |
| 60 | if (groupEvent === 'radio') { |
| 61 | (element.querySelectorAll('input[type=radio]') || []).forEach(item => { |
| 62 | if (item !== evt.target) item.setAttribute('checked', false) |
| 63 | }) |
| 64 | detail.value = evt.target.value |
| 65 | } else if (groupEvent === 'checkbox') { |
| 66 | detail.value = (element.querySelectorAll('input[type=checkbox]') || []) |
| 67 | .filter(item => item.checked) |
| 68 | .map(item => item.value) |
| 69 | } |
| 70 | |
| 71 | element.$$trigger('change', { |
| 72 | event: new Event({ |
| 73 | timeStamp: evt.timeStamp, |
| 74 | touches: evt.touches, |
| 75 | changedTouches: evt.changedTouches, |
| 76 | name: 'change', |
| 77 | target: element, |
| 78 | eventPhase: Event.AT_TARGET, |
| 79 | detail, |
| 80 | $$extra: {$$isGroup: true}, |
| 81 | }), |
| 82 | currentTarget: element, |
| 83 | }) |
| 84 | }) |
| 85 | } |
| 86 | |
| 87 | return element |
| 88 | } |
| 89 | |
| 90 | |
| 91 | class Document extends EventTarget { |
no test coverage detected