react-dnd开发实录

[cisen]

公共组件对外接口格式

block

{
    width: 0,
    height: 0,
    top: 0,
    left,
    isFlex: false,
    enableResize: false,
    enableMove: true
}

注意

const SourceEmptyBlock = Block.genDNDBlock(DropTargetParams);
let draggedInst = [];
    if (storeData.inst && storeData.inst.length) {
      storeData.inst.map((item, index) => {
        const Child = getComponentByType(item.type)
        // 这里注意，key是不会传下去的
        draggedInst.push(<Child
          {...item}
          store={store}
          key={item.key}
          enableBubble={false}
          child={item.child}
          storeData={storeData} />
        )
      })
    }
    return (
      <div className={`${prefixCls}`}>
        <SourceEmptyBlock
          defaultStyle={{height: '100%', width: '100%'}}
          store={store}
          enableBubble={false}
          storeData={storeData}>
          {draggedInst}
        </SourceEmptyBlock>
      </div>
    )

2. 数值的运算函数不存入json，因为json转字符串会被删掉

   工单

3. hover时模块边框要亮
4. 根据x轴和y轴的可拖拽性显示圈和方形
5. 鼠标移入可修改的文本框，鼠标要变成竖线
6. 缩放的点要显示特殊的鼠标样式

   解决难题

7. 下一页的渲染基于上一页的渲染结果。成功将123...n的计算量转换成N2
8. 要求不弹出渲染预览页。这里会有严重的异步控制问题，具体渲染顺序是：

9. 先渲染一页，计算每一页条数并存储起来（在最后一条data didmount后触发计算完成）
10. 计算完条数后再一次全部渲染成为打印页（在最后一页 didmount后触发startprint）
11. 打印页渲染完成后触发打印功能

[cisen]

迁移到全系统可用

需要考虑的问题：

1. 性能问题，打印1000件商品如何
2. 数据升级问题，旧模板兼容
3. DPI缩放问题