Question

我正在尝试在集合中获取随机文档并将其显示在页面上。每次加载页面都会成功，但我也想要一个按钮来完成工作。

main.html中

<head>
  <title>test</title>
</head>

<body>
  <h1>Random Question</h1>
  {{> question}}
</body>

<template name="question">
  <button>Click Me</button>
  {{#each object}}
      {{question}}
      {{a}}
      {{b}}
      {{c}}
      {{d}}
      {{answer}}
      {{points}}
  {{/each}}

</template>

main.js

import { Template } from 'meteor/templating';
import { ReactiveVar } from 'meteor/reactive-var';

import './main.html';
Resolutions = new Mongo.Collection('quiz');

Template.question.created = function () {

  var random = get_random();

  this.question = new ReactiveDict();
  this.question.set('object', random);
};

function get_random(){
  var collection_size = Resolutions.find().count();
  var random = Math.floor(Random.fraction() * collection_size);
  // choose a random item by skipping N items
  var item = Resolutions.findOne({},{
    skip: random
  });
  var objArray = $.makeArray(item);
  return objArray;
}

Template.question.helpers({
  object: function () {
    return get_random();
  }
});

Template.question.events({
  'click button': function (event, template) {
    // increment the counter when button is clicked
    var random = get_random();
    template.question.set('object', random);
  }
});

加载页面或单击按钮时没有错误消息。

感谢任何帮助。顺便问一下，“this.question.set（'object'，random）;”中的对象是什么。也许这就是我的问题所在。

Answer 1

您可以通过而不是在帮助程序中选择一个随机对象来大大简化您的代码并解决您的问题 - 即使您没有预料到，也会多次运行。此外，由于您只查看单个对象，因此请使用{{#with }}代替{{#each }} - 这样可以避免数组转换步骤。

HTML：

<template name="question">
  <button>Click Me</button>
  {{#with object}}
      {{question}}
      {{a}}
      {{b}}
      {{c}}
      {{d}}
      {{answer}}
      {{points}}
  {{/with}}
</template>

JS：

import { Template } from 'meteor/templating';
import './main.html';

Resolutions = new Mongo.Collection('quiz');

Template.question.created = function () {
  setRandom(); // initialize the random selection
};

function setRandom(){
  var collection_size = Resolutions.find().count();
  var random = Math.floor(Random.fraction() * collection_size);
  Session.set('random',random);
}

Template.question.helpers({
  object: function () {
    return Resolutions.findOne({},{ skip: Session.get('random') });
  }
});

Template.question.events({
  'click button': function (event, template) {
    setRandom();
  }
});

Meteor - 按钮单击不更新值

1 个答案: