Meteor 简单的流星插入不工作_Meteor

Meteor 简单的流星插入不工作

meteor

Meteor 简单的流星插入不工作,meteor,Meteor,我刚刚开始使用Meteor，无法获得以下简单集合的代码。请插入以在触发事件时更新数据库。我甚至可以看到页面在消失前的一瞬间用文本字段的值进行了更新（大概是在Meteor意识到该值没有写入服务器时）。通过控制台插入工作正常。。。是否有一些我忽略的基本概念 file.js var Tasks = new Meteor.Collection("Tasks"); if (Meteor.isClient) { Template.main.task = function() {

我刚刚开始使用Meteor，无法获得以下简单集合的代码。请插入以在触发事件时更新数据库。我甚至可以看到页面在消失前的一瞬间用文本字段的值进行了更新（大概是在Meteor意识到该值没有写入服务器时）。通过控制台插入工作正常。。。是否有一些我忽略的基本概念

file.js

var Tasks = new Meteor.Collection("Tasks");

if (Meteor.isClient) {

    Template.main.task = function() {
        return Tasks.find({});
    };

    Template.main.events = {
        'click #submit' : function(event) {
            var task = document.getElementById("text").value;
                Tasks.insert({title: task});
        }
    };
}

file.html

<body>
  {{> main}}
</body>

<template name="main">
    <form class="form-inline">
        <input type="text" id="text" class="input-small" />
        <input type="Submit" class="btn" id="submit" value="Submit"/>
    </form>
    {{#each task}}
        <span id="output">{{title}}</span>
    {{/each}}
</template>


{{>main}
{{{#每个任务}
{{title}}
{{/每个}}

在执行javascript之前，您的提交按钮会发出页面重新加载，从而取消对服务器的请求

尝试使用“mousedown”而不是“click”，或者（更好）阻止按钮重新加载页面

尝试使用此代码段，它会禁用按钮的提交，因此只执行javascript

<body>
  {{> main}}
</body>

<template name="main">
    <form class="form-inline">
        <input type="text" id="text" class="input-small" />
        <button type="button" class="btn" id="submit">Submit</button>
    </form>
    {{#each task}}
        <span id="output">{{title}}</span>
    {{/each}}
</template>


{{>main}
提交
{{{#每个任务}
{{title}}
{{/每个}}

我将您的第二个

-标记更改为button，并将其类型属性设置为“button”，以使按钮不起任何作用。

在执行javascript之前，您的submit按钮会发出页面重新加载，取消对服务器的请求

尝试使用“mousedown”而不是“click”，或者（更好）阻止按钮重新加载页面

尝试使用此代码段，它会禁用按钮的提交，因此只执行javascript

<body>
  {{> main}}
</body>

<template name="main">
    <form class="form-inline">
        <input type="text" id="text" class="input-small" />
        <button type="button" class="btn" id="submit">Submit</button>
    </form>
    {{#each task}}
        <span id="output">{{title}}</span>
    {{/each}}
</template>


{{>main}
提交
{{{#每个任务}
{{title}}
{{/每个}}

我将您的第二个

-标记更改为button，并将其type属性设置为“button”，以使按钮不起任何作用