从元素外部调用LitElement方法

时间:2019-09-30 14:22:46

标签: lit-element

我有一个简单的LitElement组件,如下所示:

class MyElement extends LitElement {

  constructor() {
    super();
  }

  customMethod(data) {
    // do something with the passed parameter
  }

  render() { 
    return html`<div id="element"></div>`;
  }
}

customElements.define('my-element', MyElement);

而且我希望能够从我的元素外部调用该customMethod。

例如,如果我将元素添加到网页中,例如:

<my-element></my-element>

然后我希望能够向页面添加一些JavaScript并调用该customMethod。

我尝试过:

var element = document.getElementById('element');

element.shadowRoot.customMethod('example data');

但是它声称它不可用...如何在LitElement实例上调用方法?

1 个答案:

答案 0 :(得分:4)

您不需要在通话中使用shadowRoot:

  import java.sql.Date

  val testSchema = List(
    StructField("test_string", StringType, true),
    StructField("test_date", DateType, true)
  )

  val testData = Seq(
    Row("hello", Date.valueOf("2019-10-29")),
    Row("world", Date.valueOf("2019-08-30"))
  )

  val testDF = spark.createDataFrame(
    spark.sparkContext.parallelize(testData),
    StructType(testSchema)
  )

  testDF.show()
  testDF.printSchema()


+-----------+----------+
|test_string| test_date|
+-----------+----------+
|      hello|2019-10-29|
|      world|2019-08-30|
+-----------+----------+

root
 |-- test_string: string (nullable = true)
 |-- test_date: date (nullable = true)

但是您需要能够找到您的元素

var element = document.getElementById('element');

element.customMethod('example data');