小编m1g*_*u3l的帖子

我想知道在React app中实现布局的最佳方法是什么.

基本

假设我们想要在简单的网格中布置4个组件.最基本的方式是这样的.

<svg width={width} height={height} viewBox={`0 0 ${width} ${height}`}>
  <A color="red" x={0} y={0} width={width/2} height={height/2} />
  <B color="blue" x={width/2} y={0} width={width/2} height={height/2} />
  <B color="green" x={0} y={height/2} width={width/2} height={height/2} />
  <A color="yellow" x={width/2} y={height/2} width={width/2} height={height/2} />
</svg>

http://codepen.io/anon/pen/OWOXvV?editors=0010

它可以正常工作,但键入显式大小值容易出错并且不适合开发人员.如果我们可以使用百分比值(0 - 1),该怎么办？

简单的容器

const Container = ({x, y, width, height, children}) => {
  return (
    <g transform={`translate(${x}, ${y})`}>
      {React.Children.map(children, (child) => React.cloneElement(child, { // this creates a copy
        x: child.props.x * width,
        y: child.props.y * height,
        width: child.props.width …

我一直试图使用Flexbox滚动来停止类似表格的网格.

大多数都可以正常工作,但有没有办法强制行在水平滚动时打开其内容的宽度？

如您所见,每个偶数行都有白色背景,因此很容易发现宽度有问题.

http://jsbin.com/fedisozafe/embed?html,css,output

$('.tbody').on('scroll', function(e) {
    $(this).siblings().scrollLeft($(this).scrollLeft());
});

$('.tbody').perfectScrollbar();

$(window).on('resize', function(e) {
    $('.tbody')
      .perfectScrollbar('update')
      .siblings()
        .scrollLeft($(this).scrollLeft());
});


angular.module('app', [])
    .controller('testController', [
        '$scope',
        function($scope) {
            this.n = 5;
            $scope.$watch(() => this.n, () => this.collection = _.range(this.n));
        }
    ]);

* {
    box-sizing: border-box;
    border-collapse: collapse;
}
.table {
    display: flex;
    flex-direction: column;
    flex-wrap: nowrap;
    border: solid 1px red;
}
.table > * {
    border-top: solid 1px transparent;
    border-bottom: solid 1px transparent;
}
.thead {
    border-bottom: solid 1px red;
}
.tfoot { …

假设我有一个界面:

interface Comparable<T> {
    equals(other:T):boolean
}

然后我在几个类中实现:

class Rectangle implements Comparable<Rectangle> {

    equals(other:Rectangle):boolean {
        // logic
        return true;
    }

}

class Circle implements Comparable<Circle> {

    equals(other:Circle):boolean {
        // logic
        return true;
    }

}

为什么TypeScript允许比较矩形和圆形？

let circle:Circle = new Circle();
let rectangle:Rectangle = new Rectangle();
console.log( circle.equals(rectangle) );

它不应该警告我,我提供了不相容的类型圆圈的等于方法吗？

我正在尝试从节点上的 MongoDB 获取文档。假设文档具有以下结构：

{ "_id": ObjectId, "title" : String, "tags" : Array<String> }

我想按相关性对它们进行排序 - 因此，当我寻找带有“蓝色”或“黄色”标签的文档时，我想先获取带有两个标签的文档。到目前为止，我由谷歌管理，反复试验：

var tags = [ "yellow", "blue" ];
db.collection('files').aggregate([
    { $project : { tags: 1 } },
    { $unwind : "$tags" },
    { $match : { "tags": { "$in": tags } } },
    { $group : { _id: "$_id", relevance: { $sum:1 } } },
    { $sort : { relevance : -1 } },
], function(err, success) {
    console.log(success);
});

它工作得很好，我得到了排序的 id 集合：

[{"_id":"5371355045002fc820a09566","relevance":2},{"_id":"53712fc6c8fcd124216de6cd","relevance":2},{"_id":"5371302ebd4725dc1b908316","relevance":1}]

现在我将进行另一次查询并要求使用这些 …

我安装了Nexus Repository Manager OSS 3.2.1并在本地计算机上运行它.

组态

我在Nexus中定义了三个NPM存储库:

• [PUBLIC] - 公共npm注册表的代理
• [PRIVATE] - 我自己的软件包的私有存储库
• [NPM] - 一个组存储库,允许按此顺序访问[PRIVATE]和[PUBLIC]

在设置/安全/领域中,我添加了npm Bearer Token Realm.

下载

我可以从[PUBLIC]下载包,它按预期工作.

.npmrc 
registry=http://localhost:8081/repository/PUBLIC
npm install react // works fine, downloads from [PUBLIC]

我可以从[NPM]下载包,它按预期工作.

.npmrc 
registry=http://localhost:8081/repository/NPM
npm install react // works fine, downloads from [PUBLIC]

它不适用于[PRIVATE],因为我没有名为react的包.

出版

我不想发布到[PUBLIC].

我可以将包发布到[PRIVATE],它可以按预期工作.

.npmrc 
registry=http://localhost:8081/repository/PRIVATE
npm publish // works fine, publishes to [PRIVATE]

我无法将包发布到[NPM],这很奇怪.

.npmrc 
registry=http://localhost:8081/repository/NPM
npm publish // fails, should publish to [PRIVATE]
// gets HTTP 400

错误

详细日志:https://pastebin.com/5GuqNNhf

问题 …