Question

我过去曾使用过某种方法让Vaadin-grid空白，但与<vaadin-grid-column> <template class="header"> <div class="horizontal layout cell"> <label for="keyFilter" class="keyText cell flex">Key</label> <vaadin-grid-filter class="cell" id="keyFilter" path="key" value="[[_filterKey]]"> <paper-input no-float-label class="keyFilter" id="keyFilter" slot="filter" placeholder="Filter search" value="{{_filterKey::input}}" focus-target on-input="clearAppear" > <iron-icon suffix icon="clear" class="clearIcon" on-click="clearField" clear-item-id="keyFilter"></iron-icon> </paper-input> </vaadin-grid-filter> </div> </template> <template class="cell">[[item.key]]</template> </vaadin-grid-column>结合使用时，我的常用方法无效。

我在这里错过了什么吗？

Vaadin-grid HTML

// Attempt 1 - gives "undefined" within the dev tools 
this.$.keyFilter.value = '';

// Attempt 2 - finds the correct element, but does not set the value to blank
document.getElementById('keyFilter').value = ''

我尝试过以下JS：

import pandas as pd
import numpy as np
arrays = [['bar', 'bar', 'bar','bar', 'foo','foo', 'qux', 'qux', 
'qux','qux', 'qux'],
      ['2', '3', '4','10', '3','10','2','3','6','10','11']]
df = pd.DataFrame(np.random.randn(11, 4), index=arrays).sort_index()
# your slice
col_list = ['2','3','10']
sliced = df.loc[(slice(None), col_list), :]

Answer 1

要在元素的shadow DOM中定位动态创建的节点，请使用标准DOM querySelector方法：

this.shadowRoot.querySelector(selector)

因此，对于您的问题，请使用this.shadowRoot.querySelector("#keyFilter").value='';

您在上述代码中犯了一个简单的错误，即为id和vaadin-grid-filter元素提供相同的paper-input名称。在尝试上述代码之前，请务必更改此内容。

无法清除Vaadin-grid内的输入？

1 个答案: