小编Ian*_*lor的帖子

我有三种不同的方法来初始化和呈现视图及其子视图,并且每个方法都有不同的问题.我很想知道是否有更好的方法可以解决所有问题:

情景一:

在父级的初始化函数中初始化子级.这样,并不是所有东西都会陷入渲染状态,因此渲染时阻塞较少.

initialize : function () {

    //parent init stuff

    this.child = new Child();
},

render : function () {

    this.$el.html(this.template());

    this.child.render().appendTo(this.$('.container-placeholder');
}

问题:

• 最大的问题是第二次在父级上调用render将删除所有的子事件绑定.(这是因为jQuery的$.html()工作原理.)这可以通过调用this.child.delegateEvents().render().appendTo(this.$el);来减轻,但是第一个,也是最常见的情况是,你正在做更多不必要的工作.

• 通过附加子项,可以强制render函数了解父DOM结构,以便获得所需的顺序.这意味着更改模板可能需要更新视图的渲染功能.

情景二:

初始化父级的子级initialize(),但不是追加,而是使用setElement().delegateEvents()将子级设置为父级模板中的元素.

initialize : function () {

    //parent init stuff

    this.child = new Child();
},

render : function () {

    this.$el.html(this.template());

    this.child.setElement(this.$('.placeholder-element')).delegateEvents().render();
}

问题:

• 这使得delegateEvents()现在变得必要,这只是在第一个场景中的后续调用中必需的一点点负面.

情景三:

render()而是在父方法中初始化子项.

initialize : function () {

    //parent init stuff
},

render : function () {

    this.$el.html(this.template()); …

我有一个嵌套的视图设置,可以在我的应用程序中得到一些深度.有很多方法我可以想到初始化,渲染和追加子视图,但我想知道常见的做法是什么.

这是我想到的一对夫妇:

initialize : function () {

    this.subView1 = new Subview({options});
    this.subView2 = new Subview({options});
},

render : function () {

    this.$el.html(this.template());

    this.subView1.setElement('.some-el').render();
    this.subView2.setElement('.some-el').render();
}

优点:您不必担心通过追加维护正确的DOM顺序.视图在早期初始化,因此在渲染函数中不会同时执行所有操作.

缺点:你被迫重新委托事件(),这可能是昂贵的？父视图的渲染函数与所有需要发生的子视图渲染混杂在一起？您无法设置tagName元素,因此模板需要维护正确的tagNames.

其他方式:

initialize : function () {

},

render : function () {

    this.$el.empty();

    this.subView1 = new Subview({options});
    this.subView2 = new Subview({options});

    this.$el.append(this.subView1.render().el, this.subView2.render().el);
}

优点:您无需重新委派活动.您不需要仅包含空占位符的模板,并且您的tagName将返回由视图定义.

缺点:您现在必须确保以正确的顺序附加内容.子视图渲染仍然使父视图的渲染变得混乱.

有一个onRender事件:

initialize : function () {
    this.on('render', this.onRender);
    this.subView1 = new Subview({options});
    this.subView2 = new Subview({options});
},

render : …

我搜索了一堆页面,但找不到我的问题,所以我不得不发帖子.

我有一个具有提交按钮的表单,并在提交时我希望它不刷新或重定向.我只是想让jQuery执行一个功能.

这是表格:

<form id="contactForm">
    <fieldset>
        <label for="Name">Name</label>
        <input id="contactName" type="text" />
    </fieldset>

    <fieldset>
        <label for="Email">Email</label>
        <input id="contactEmail" type="text" />
    </fieldset>

    <fieldset class="noHeight">
        <textarea id="contactMessage" cols="20"></textarea>
        <input id="contactSend" class="submit" type="submit" onclick="sendContactForm()" />
    </fieldset>
</form>        
<small id="messageSent">Your message has been sent.</small>

这是jQuery:

function sendContactForm(){
    $("#messageSent").slideDown("slow");
    setTimeout('$("#messageSent").slideUp();$("#contactForm").slideUp("slow")', 2000);
}

我已尝试在表单上使用和不使用操作元素,但不知道我做错了什么.令我恼火的是,我有一个完美的例子: 示例页面

如果你想现场查看我的问题,请转到stormink.net(我的网站)并查看侧栏,上面写着"发送给我和发送电子邮件"和"RSS订阅".这两种形式都是我试图让它继续工作的形式.

我正在构建一个包含内容和可由用户定义的模式的通用API.我想为API响应添加过滤逻辑,以便用户可以查询它们存储在API中的特定对象.例如,如果用户正在存储事件对象,他们可以执行以下操作:

• 数组包含:是否properties.categories包含Engineering
• 更重要的是:是否properties.created_at比年龄大2016-10-02
• 不相等:是否properties.address.city不是Washington
• 平等:无论properties.name是Meetup
• 等等

我正在尝试设计过滤到API响应的查询字符串,并提出一些选项,但我不确定它的哪种语法最好...

1.作为嵌套密钥的运算符

/events?properties.name=Harry&properties.address.city.neq=Washington

此示例仅使用嵌套对象来特定运算符(neq如图所示).这很好,因为它非常简单,易于阅读.

但是,如果事件的属性可以由用户定义,则会遇到一个问题,即address.city.neq使用普通等于运算符命名的属性与address.city使用不等于运算符命名的属性之间可能存在冲突.

示例:Stripe的API

2.运营商作为关键后缀

/events?properties.name=Harry&properties.address.city+neq=Washington

此示例与第一个示例类似,不同之处在于它使用+分隔符(相当于空格)进行操作,而不是.因为没有混淆,因为我的域中的键不能包含空格.

一个缺点是它稍微难以阅读,尽管这可以说是有争议的,因为它可能被解释为更清楚.另一个可能是解析起来稍微困难,但不是那么多.

3.运算符作为值前缀

/events?properties.name=Harry&properties.address.city=neq:Washington

此示例与前一个示例非常相似,只是它将运算符语法移动到参数的值而不是键.这有利于消除解析查询字符串的一些复杂性.

但这是以不再能够区分检查文字字符串的相等运算符和检查字符串neq:Washington的不相等运算符为代价的Washington.

示例:Sparkpay的API

4.自定义过滤器参数

/events?filter=properties.name==Harry;properties.address.city!=Washington

此示例使用单个顶级查询参数filter来命名所有过滤逻辑.这很好,因为您永远不必担心顶级命名空间冲突.(虽然在我的情况下,所有自定义都嵌套properties.在一起,所以这首先不是问题.)

但是,当您想要进行基本的相等过滤时,需要输入更难的查询字符串,这可能会导致必须在大多数时间检查文档.并且依赖于运算符的符号可能会导致诸如"近"或"内"或"包含"之类的非明显操作的混淆.

示例:Google Analytics的API

5.自定义详细过滤参数

/events?filter=properties.name eq Harry; properties.address.city neq Washington

此示例使用与前一个类似的顶级filter参数,但它使用单词拼写运算符而不是使用符号定义它们,并且它们之间有空格.这可能稍微更具可读性.

但这需要花费更长的URL,以及需要编码的大量空间？

示例:OData的API

6.对象过滤器参数

/events?filter[1][key]=properties.name&filter[1][eq]=Harry&filter[2][key]=properties.address.city&filter[2][neq]=Washington

此示例还使用顶级 …

我总是听说CSS中的边距会在彼此相邻时崩溃,因此设置两个元素以使其全部为40px只会导致它们之间的40px.

这是一种渲染CSS的旧方法,因为它不再以这种方式工作了吗？

这是HTML和CSS.我似乎无法让边缘崩溃:

相关的HTML

<div id="header">
    <div id="mainNav" class="navBar">
        <a id="homeLink" class="navBarLinks">Home</a>
        <a id="aboutLink" class="navBarLinks">About</a>
        <a id="articlesLink" class="navBarLinks">Articles</a>
        <a id="portfolioLink" class="navBarLinks">Portfolio</a>
        <a id="contactLink" class="navBarLinks">Contact</a>
        <a id="rssLink" class="navBarLinks">RSS</a>
    </div>
    <div class="infoBar"></div>
</div>

CSS

#header { width: 100% }
.navBar {
    width: 100%;
    height: 24px;
    background-color: #1a1a1a;
    border: 0px solid #404040
}
#mainNav { border-bottom-width: 2px }
.navBarLinks {
    display: block; float: left;
    height: 11px;
    margin: 0 30px;
    background: url(/images/STORMINKsprite.png) no-repeat;
    text-indent: -9999px
}

感谢您的建议!

他们被允许吗？他们是否适用于所有浏览器？

例:

<div role = "region"
     id = "some-id"
     class = "a-class another-class">

问题只发生input[type="text"]在Webkit中.无论我做什么,都会padding: 1px 0 0 1px在元素上产生额外的(仅限顶部和左侧).

类似的问题发生在Gecko中,input[type="text"]具有相同的额外功能padding: 1px 0 0 1px并且input[type="button"]具有额外的功能padding: 1px 0 0 0.

这是一个JSFiddle,向您展示我尝试过的所有内容,但没有任何作用:http://jsfiddle.net/PncMR/10/

有趣的是,当你将所有元素的行高设置为0(http://jsfiddle.net/PncMR/11/)时,唯一不受影响的元素是有问题的元素,所以我假设浏览器是默认的到特定的行高,我现在正在寻找一种覆盖它的方法.

我在webkit基础样式中找不到任何可以执行此操作的内容,但请随意检查自己:

http://trac.webkit.org/browser/trunk/Source/WebCore/css/html.css

这不是moz-focus-inner问题,appearance: none问题,box-sizing问题或outline问题,我找不到任何其他解决方案.

编辑:请参阅下面的答案,了解垂直填充问题,但我仍然padding-left: 1px只在webkit和gecko中寻找文本输入的额外等价物的解决方案.(http://jsfiddle.net/PncMR/14/)

我正在设置一个计划,以便我的登台数据库始终是我的生产数据库的副本,并且每天或每小时一次复制.

我知道有一种简单的方法来执行一次性复制,使用heroku pg:

heroku pg:copy SOURCE_APP::SOURCE_DATABASE DESTINATION_DATABASE --app DESTINATION_DATABASE

但这只是一次性的事情.

我也知道使用Heroku调度程序运行预定命令很容易,这些命令在一次性dynos中运行.但是dynos上heroku pg:copy没有安装Heroku Toolbelt,因此无法使用.

我尝试过使用pg_dump | pg_restore,但我遇到了两个问题之一:

在不限制架构的情况下,它失败了,因为我认为没有正确的权限:

pg_restore: [archiver (db)] Error while PROCESSING TOC:
pg_restore: [archiver (db)] Error from TOC entry 3205; 0 0 COMMENT EXTENSION plpgsql 
pg_restore: [archiver (db)] could not execute query: ERROR:  must be owner of extension plpgsql
    Command was: COMMENT ON EXTENSION plpgsql IS 'PL/pgSQL procedural language';

限制pg_dump为仅限于--schema=public,它失败,因为某些扩展依赖于公共模式,并且它们不会被删除.

pg_restore: [archiver (db)] Error while PROCESSING TOC:
pg_restore: …

我正在尝试向API添加一个授权层,而我当前的设计会产生比我们想要的更多的SQL查询,所以我想知道如何简化这一点.

上下文

以下是此问题的数据库架构:

CREATE TABLE IF NOT EXISTS users (
  id          TEXT PRIMARY KEY,
  email       CITEXT NOT NULL UNIQUE,
  password    TEXT NOT NULL,
  name        TEXT NOT NULL,
  created_at  DATE NOT NULL DEFAULT CURRENT_TIMESTAMP
);

CREATE TABLE IF NOT EXISTS teams (
  id          TEXT PRIMARY KEY,
  email       CITEXT NOT NULL,
  name        TEXT NOT NULL,
  created_at  DATE NOT NULL DEFAULT CURRENT_TIMESTAMP
);

CREATE TABLE IF NOT EXISTS memberships (
  id          TEXT PRIMARY KEY,
  "user"      TEXT NOT NULL REFERENCES users(id) ON UPDATE CASCADE …

我在StackOverflow上看到了许多不同的解决方案,这些解决方案跨越了多年,并且有很多Postgres版本,但是有一些较新的功能,比如gen_random_bytes我想再次询问是否有更简单的新版本解决方案.

给定的ID包含a-zA-Z0-9,并根据使用的位置而变化,如...

bTFTxFDPPq
tcgHAdW3BD
IIo11r9J0D
FUW5I8iCiS

uXolWvg49Co5EfCo
LOscuAZu37yV84Sa
YyrbwLTRDb01TmyE
HoQk3a6atGWRMCSA

HwHSZgGRStDMwnNXHk3FmLDEbWAHE1Q9
qgpDcrNSMg87ngwcXTaZ9iImoUmXhSAv
RVZjqdKvtoafLi1O5HlvlpJoKzGeKJYS
3Rls4DjWxJaLfIJyXIEpcjWuh51aHHtK

(就像Stripe使用的ID一样.)

在Postgres 9.6+中,如何通过一种简单的方法为不同的用例指定不同的长度,如何随机安全地生成它们(就减少冲突和降低可预测性而言)？

我认为理想情况下解决方案的签名类似于:

generate_uid(size integer) returns text

哪里size可以根据您自己的权衡来定制,以降低碰撞的可能性与减少可用性的字符串大小.

从我所知道的,它必须使用gen_random_bytes()而不是random()真正的随机性,以减少他们被猜到的机会.

谢谢!

我知道有gen_random_uuid()UUID,但在这种情况下我不想使用它们.我正在寻找能给我ID类似于Stripe(或其他人)使用的ID的东西,它们看起来像:"id": "ch_19iRv22eZvKYlo2CAxkjuHxZ"尽可能短,同时仍然只包含字母数字字符.

这个要求也是为什么encode(gen_random_bytes(), 'hex')不适合这种情况,因为它减少了字符集,因此迫使我增加字符串的长度以避免冲突.

我目前正在应用程序层中执行此操作,但我希望将其移动到数据库层以减少相互依赖性.以下是在应用程序层中执行此操作的Node.js代码可能如下所示:

var crypto = require('crypto');
var set = 'ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789';

function generate(length) {
  var bytes = crypto.randomBytes(length);
  var chars = [];

  for (var i = 0; i < …