GithubHelp home page GithubHelp logo

weex-native-directive's Issues

所有例子WeexPlayground都不能运行

运行时报 TypeError: Cannot read property 'label' of undefined
at Ot.render (0658e5ec6c1d83e8c19adde7e0b2a0fa.bundle.vue.js:714)
at Ot.e._render (vue.min.js:6)
at Ot.r (vue.min.js:6)
at Uo.get (vue.min.js:6)
at new Uo (vue.min.js:6)
at Se (vue.min.js:6)
at Ot.$mount (vue.min.js:6)
at Ot.$mount (vue.min.js:6)
at Ot.e._init (vue.min.js:6)
at new Ot (vue.min.js:6)

Support to use filters

Using callbacks to support filters in the template.

<text>{{ item.title | i18n }}</text>

Should be compiled to:

{
  type: 'text',
  attrs: {
    value: {
      '@binding': 'item.title'
      '@filters': [i18n]
   }
}

The i18n is a function, and it'll be converted into a callback id when sending to native. Native render engines should get the value of item.title and pass it to the callbacks which are defined in @filters.

Parse object literal in binding attributes or styles

Source:

<div :style="{ fontSize: 15, color: item.color }"></div>

Should be compiled to:

{
  style: {
    fontSize: 15,
    color: { '@binding':  'item.color' }
  }
}

Current is:

{
  style: {
    '@binding':  '{ fontSize: 15, color: item.color }'
  }
}

Ios 上数据源为 null 崩溃

image

Ios 上数据源为 null 崩溃,安卓没问题。

1:facilityClass 初始值为null,会崩溃,
2: facilityClass 初始值为空数组 [ ],后续赋值为null,不会崩溃

提示:Unknown custom element: <recycle-list>,怎么解决呢?

Unknown custom element: < recycle-list > - did you register the component correctly? For recursive components, make sure to provide the "name" option.


我用weex-toolkit 建了一个新页面,然后在里面使用了 recycle-list这个组件,编译时顺利通过,运行时会提示以上的错误。

运行: weex --version 查到的版本信息如下:
v1.1.0-beta.6

  • weexpack : v0.4.7-beta.21
  • weex-builder : v0.2.13-beta.4
  • weex-previewer : v1.3.13-beta.12
  • toolkit-repair : v0.0.5

Manage style sheets in native render engines

<div :class="box.classList"></div>

Will be compiled to:

{
  type: 'div',
  attrs: {
    class: {
      '@binding': 'box.classList'
    }
  }
}

Currently, class names and the stylesheet are managed in front-end frameworks and weex-js-runtime. However, in this case, the result of box.classList couldn't be got in front-end frameworks.

The stylesheet should be managed in native render engines.

To support scrollToElement

when will the recycle-list support the Dom API scroolToElement, or providing another API to support scroll to specific height is also OK.

Simplified syntax?

Currently it seems switch and case attributes (previously template-key and template-type) are always required, even when there is only one <cell-slot>.

I think when there is only one <cell-slot>, it should be used by default, so switch and case can be omitted:

<recycle-list for="item in longList">
  <cell-slot>
    <text>{{ item.foo }}</text>
  </cell-slot>
</recycle-list>

Use more readable attributes on `<recycle-list>`

Syntax

Change the compiler to support the new syntax.

  • Use for instead of the list-data, alias and index.
  • Use switch instead of the template-key.
  • Use case instead of the template-type.

Examples

Before:

<recycle-list :list-data="longList" template-key="cellType" alias="item" index="i">
  <cell-slot template-type="A"> ... </cell-slot>
  <cell-slot template-type="B"> ... </cell-slot>
</recycle-list>

After:

<recycle-list for="(item, i) in longList" switch="cellType">
  <cell-slot case="A"> ... </cell-slot>
  <cell-slot case="B"> ... </cell-slot>
</recycle-list>

The data of longList still should be binding with the <recycle-list>.

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.