javascript - 为什么 rowspan 属性在 Matt-Esch/virtual-dom 库中不起作用？

Question

我正在使用 Matt-Esch virtual-dom 图书馆。

我需要创建一个带有rowspan的表，如下所示( jsfiddle ):

<a href="google.co.uk">Link</a>
<table>
    <tr>
        <td rowspan=2>Foo</td>
        <td>Baz</td>
        <td>Baz</td>
    </tr>
    <tr>
        <td>Baz</td>
        <td>Baz</td>
    </tr>    
</table>

但是当我尝试使用 virtual-dom 时，rowspan 属性被忽略( requirebin ):

var h = require('virtual-dom/h');
var createElement = require('virtual-dom/create-element');

function draw()  {
    return h('div', [
      h('a', {href: 'google.co.uk'}, 'link'),
      h('table', [
            h('tr', [
                h('td', {rowspan: '2'}, 'Foo'),
                h('td', 'Baz'),
                h('td', 'Baz')
            ]),
            h('tr', [
                h('td', 'Baz'),
                h('td', 'Baz')
            ]),
        ]),
    ])
}

var tree = draw();              
var rootNode = createElement(tree);
document.body.appendChild(rootNode);

我注意到链接的 href 属性按预期工作，但 td 上的 rowspan 属性却没有。

为什么 rowspan 属性在 Matt-Esch/virtual-dom 库中不起作用？

Answer 1

virtual-dom 处理 JavaScript DOM 属性，而不是 HTML 属性。

JavaScript DOM 属性区分大小写，HTML rowspan 属性映射到 the rowSpan (with a capital S) property .