Polymer 铁媒体查询不起作用-聚合物1.0

我是聚合物1.0的新手

我的元素不起作用。控制台中没有错误，但不显示任何内容

一些改进会很棒！我试着从2个小时开始启动并运行它

提前谢谢

罗恩

---

您必须将queryMatches={{}}更改为queryMatches={{}。

您必须将queryMatches={{}}更改为queryMatches={{}。

因为您还询问了选项：

因为SmallScreen和not之间的数据没有很大差异，所以：

[[screenType]]屏幕 聚合物{ 是：“自定义元素”， 特性：{ 查询：{ 类型：字符串， 通知：正确 }, 屏幕类型：{type:String，computed:'\u computeScreenTypesmallScreen'} }, _computeScreenType:t=>{返回t？小：大} };

---

由于您还询问了有关选项的问题：

因为SmallScreen和not之间的数据没有很大差异，所以：

[[screenType]]屏幕 聚合物{ 是：“自定义元素”， 特性：{ 查询：{ 类型：字符串， 通知：正确 }, 屏幕类型：{type:String，computed:'\u computeScreenTypesmallScreen'} }, _computeScreenType:t=>{返回t？小：大} };

---

我还必须将is=dom if添加到模板标记中。谢谢：我还必须将is=dom if添加到模板标记中。谢谢：它很简单，但是给了你一个可读的属性，并且避免了dom if。它很简单，但是给了你一个可读的属性，并且避免了dom if。

<!-- Works correctly -->
<link rel="import" href="../polymer/polymer.html">
<link rel="import" href="../iron-media-query/iron-media-query.html">

<dom-module id="custom-element">

  <style>
    // Styles here
  </style>

  <template>

    <iron-media-query query="{{query}}" queryMatches="{{smallScreen}}"></iron-media-query>

    <template if="{{smallScreen}}">
      <strong>Small Screen</strong>
    </template>

    <template if="{{!smallScreen}}">
      <strong>Big Screen</strong>
    </template>

  </template>

</dom-module>

<script>

  Polymer({

    is: 'custom-element',

    properties: {
      query: {
        type: String,
        notify: true
      }
    }

  });

</script>

<custom-element query="(max-width:400px)"></custom-element>