WXML里面{{}}内部可以调用方法吗?
发布于 6 年前 作者 omao 19370 次浏览 来自 问答

代码如下所示,一个简单的Todo app,有一个filter来决定要显示哪些Todo(全部、已完成、未完成)
JS 文件

Page({
    data: {
        todos: [{ id: 1, title: "这是一首简单的小情歌", completed: false },
            { id: 2, title: "唱着人们心肠的曲折", completed: false },
            { id: 3, title: "我想我很快乐", completed: false }
        ],
        filters: ["All" , "Active", "Completed"],
        currentFilter: 'All',
    },    //other methods

   shouldShow(todo) {                const currentFilter = this.data.currentFilter                 return currentFilter == ‘All’                || (currentFilter == ‘Active’ && !todo.completed)                || (currentFilter == ‘Completed’ && todo.completed)    } })

WXML文件:

  <checkbox-group bindchange="toggleCompletion">
    <label wx:for="{{todos}}" wx:for-item="todo" class="todo-list" wx:key="id">
      <checkbox wx:if="{{shouldShow(todo)}}" value="{{todo.id}}" checked="{{todo.completed}}"> {{todo.title}}</checkbox>
    </label>
  </checkbox-group>

上面的代码中,想要在WXML文件里面调用JS里面定义的shouldShow(todo)来决定要不要显示某一个todo。但是上面的写法好像不能work,是WXML里面不支持方法调用吗?还是我的姿势有问题?

2 回复

@潭风 好的,谢谢!

这个不行的,只能先在js里判断好,再通过setData更新到view中。。。{{}}只能做简单的运算。整理了一些坑点,可以看看,估计有点帮助 https://github.com/senola/webchat-app-issues

回到顶部