用户
 找回密码
 立即注册

QQ登录

只需一步,快速开始

搜索
  • TA的每日心情
    慵懒
    2017-1-6 10:46
  • 签到天数: 2 天

    [LV.1]初来乍到

    173

    主题

    181

    帖子

    981

    金钱

    咫尺尊享

    Rank: 5Rank: 5

    积分
    0
    2017-1-12 12:43:07 柿霖不是林 咫尺尊享 楼主 21962



    [HTML] 纯文本查看 复制代码
    //index.js
    //获取应用实例
    const app = getApp();
    Page({
      data: {
        todo: '',
        todos: [],
        filterTodos: [],
        filter: 'all',
        userInfo: {},
        activeCount: 0,
      },
      bindTodoInput(e) {
        this.setData({
          todo: e.detail.value
        });
      },
      saveTodo(e) {
        const { todo, todos, filterTodos, filter, activeCount } = this.data;
        if (todo.trim().length === 0) return;
     
        const newTodo = {
          id: new Date().getTime(),
          todo: this.data.todo,
          completed: false,
        };
        todos.push(newTodo);
        if (filter !== 'completed') {
          filterTodos.push(newTodo);
        }
        this.setData({
          todo: '',
          todos,
          filterTodos,
          activeCount: activeCount + 1,
        });
      },
      todoFilter(filter, todos) {
        return filter === 'all' ? todos
          : todos.filter(x => x.completed === (filter !== 'active'));
      },
      toggleTodo(e) {
        const { todoId } = e.currentTarget.dataset;
        const { filter, activeCount } = this.data;
        let { todos } = this.data;
        let completed = false;
        todos = todos.map(todo => {
          if (Number(todoId) === todo.id) {
            todo.completed = !todo.completed;
            completed = todo.completed;
          }
          return todo;
        });
        const filterTodos = this.todoFilter(filter, todos);
        this.setData({
          todos,
          filterTodos,
          activeCount: completed ? activeCount - 1 : activeCount + 1,
        });
      },
      useFilter(e) {
        const { filter } = e.currentTarget.dataset;
        const { todos } = this.data;
        const filterTodos = this.todoFilter(filter, todos);
        this.setData({
          filter,
          filterTodos,
        });
      },
      clearCompleted() {
        const { filter } = this.data;
        let { todos } = this.data;
        todos = todos.filter(x => !x.completed);
        this.setData({
          todos,
          filterTodos: this.todoFilter(filter, todos),
        });
      },
      todoDel(e) {
        const { todoId } = e.currentTarget.dataset;
        const { filter, activeCount } = this.data;
        let { todos } = this.data;
        const todo = todos.find(x => Number(todoId) === x.id);
        todos = todos.filter(x => Number(todoId) !== x.id);
        this.setData({
          todos,
          filterTodos: this.todoFilter(filter, todos),
          activeCount: todo.completed ? activeCount : activeCount - 1,
        });
      },
      onLoad() {
        console.log('onLoad');
        const that = this;
        //调用应用实例的方法获取全局数据
        app.getUserInfo(function(userInfo){
          //更新数据
          that.setData({
            userInfo: userInfo
          });
          that.update();
        });
        wx.request({
          url: 'http://localhost:3000/todos',
          success: function(res) {
            const todos = res.data;
            const activeCount = todos
              .map(x => x.completed ? 0 : 1)
              .reduce((a, b) => a + b, 0);
            that.setData({
              todos,
              filterTodos: todos,
              activeCount,
            });
            that.update();
          }
        });
      }
    });


    使用方法
    • 下载工程
    [HTML] 纯文本查看 复制代码
    git clone [url]https://github.com/zhaozhiming/wechat-todolist.git[/url]


    启动服务端
    npm install -g json-server
    cd wechat-todolist
    json-server server/todo.json

    游客,如果您要查看本帖隐藏内容请回复




    本帖子中包含更多资源

    您需要 登录 才可以下载或查看,没有帐号?立即注册

    x
    使用道具 举报 回复
    哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈
    我有流量,你有产品,我们就可以合作,有意的个人开发者朋友可以联系微信号jim20180688,详聊
    发新帖
    您需要登录后才可以回帖 登录 | 立即注册
    咫尺论坛|小程序开发社区
    X

    扫码添加专属客服即可随时咨询

    还可领取小程序推广攻略