小编cha*_*olo的帖子

空白:前行在顶部添加不寻常的空间

我有一个下面的 css 声明,它添加了下面屏幕截图中给出的行距。

.colGroup{
    white-space: pre-line;
}
Run Code Online (Sandbox Code Playgroud)

我尝试添加以下属性,但没有成功。

display: inline-block;
vertical-align: top;
height: 4.75em;
line-height: 1.75em;
Run Code Online (Sandbox Code Playgroud)

编辑<td>(在我面临这个问题的地方添加了重复标签的一部分)。

<td width="15%">
    <span class="colGroup">
       <div>
            <p id="c2308view">
                t = 24 
                t1 = 27 
                t2 = 27 
                t3 = 36
                </p> 
            </div>
        </span>
        <span class="dateColumn">
            <div>
                <p id="c2312view"><span>31-Dec-2010</span></p>
            </div>
        </span>
</td>
Run Code Online (Sandbox Code Playgroud)

有人可以帮忙吗?

截屏

html css

16
推荐指数
3
解决办法
9094
查看次数

确定哪个依赖项数组变量导致useEffect钩子触发

有没有一种简单的方法来确定useEffectDependency数组中的哪个变量触发函数重新触发?

简单地注销每个变量可能会产生误导,如果a是函数和b对象,则它们在登录时可能看起来相同,但实际上却有所不同,从而引起useEffect触发。

例如:

React.useEffect(() => {
  // which variable triggered this re-fire?
  console.log('---useEffect---')
}, [a, b, c, d])
Run Code Online (Sandbox Code Playgroud)

我当前的方法一直是一个一个地删除依赖变量​​,直到我注意到导致过多useEffect调用的行为,但是必须有一种更好的方法来缩小此范围。

javascript reactjs react-hooks

12
推荐指数
5
解决办法
870
查看次数

ES6解构一个对象数组

我有这个对象

const config = {
    js: {
        files: [
            {
                src: './js/app.js',
                name: 'script.js',
                dest: 'public_html/js/'
            },
            {
                src: './js/admin.js',
                name: 'script.js',
                dest: 'public_html/js/'
            }
        ]
    }
};
Run Code Online (Sandbox Code Playgroud)

我希望得到这个(获得所有来源):

sources = ['./js/app.js', './js/admin.js']

// or, at least
sources = [{'./js/app.js'}]
Run Code Online (Sandbox Code Playgroud)

我知道如何用循环来做,但我可以用ES6解构吗?

就像是:

{sources = [{src}]} = config.js;
Run Code Online (Sandbox Code Playgroud)

要么

{[{src}] : sources} = config.js;
Run Code Online (Sandbox Code Playgroud)

javascript arrays object ecmascript-6

9
推荐指数
1
解决办法
1553
查看次数

布局中绝对定位元素的制表符索引

绝对位置元素的标签索引

暂时,让我们假设我写了下面的代码:

    <header class="header hap" [ngClass]="authority">
        <div class="header-inner">
            <div class="header-identity">
                <a id="theLogo" class="logo" [routerLink]="[links.home]" title="Navigate to Home">
                    <img src="assets/logo-white.svg" alt="Logo">
                </a>
                <span class="client-logo" *ngIf="user.brandingImage && !user.isTheAdmin()">
                    <img class="brandingImage" [src]="user.brandingImage" [alt]="user.brandingName" onerror="this.style.display='none'">
                </span>
                [ more links ]
            </div>
            <nav class="main-nav for authenticated" [ngClass]="{'active':showMenu, 'app-only':!isCurrPageAdminApp()}">
                <button class="menu" (click)="toggleMenu()">Menu</button>
                <div class="main-nav-flyout" *ngIf="showMenu">
                    <div class="nav-header">
                        <ul>
                            <li>
                                <a id="main-nav-profile" [routerLink]="['/profile']"><span class="icon icon-user2"></span> My Profile</a>
                            </li>
                            [ more dropdown items ]
                        </ul>
                        <a id="main-nav-close" class="close"(click)="onClickMenuClose()"><span class="icon-cross"></span></a>
                    </div>
                    <div class="nav-body">
                        <ul *ngIf="isCurrPageAdminApp()" class="main-nav-list">
                            <li class="current-app">Administrative Tools</li> …
Run Code Online (Sandbox Code Playgroud)

html css css-position absolute tabindex

8
推荐指数
1
解决办法
901
查看次数

Webpack - 将散列包URL插入静态pug模板

我使用webpack pug-html-loader + file-loader来生成一堆静态pug模板.

我也想开始添加散列包文件名,但我无法弄清楚如何将散列文件名插入到我所有的哈巴狗模板中

这是我在所有pug模板中当前引用我的包的方式:

script(src="bundle.js")
link(href="bundle.css")
Run Code Online (Sandbox Code Playgroud)

如何修改它来引用bundle-[chunkhash].js/ bundle-[chunkhash].css]- 我是否需要将一些变量传递给我的webpack.config.js中的pug-html-loader?

注意我使用extract-text-plugin将我的SASS输出到.css包文件

javascript hash node.js webpack pug-loader

7
推荐指数
0
解决办法
618
查看次数

属性“shouldComponentUpdate”不可分配给同一属性

我在使用 TypeScript 时遇到错误shouldComponentUpdate

类型 'Hello' 中的属性 'shouldComponentUpdate' 不能分配给基类型中的相同属性Component<IProps, any, any>

在组件中:

import React, { Component } from 'react'

class Hello extends Component<IProps, any> {
  shouldComponentUpdate(nextProps: IProps) { // error here
    console.log(nextProps, 'nextProps')
  }

  ....// some code
}
Run Code Online (Sandbox Code Playgroud)

有人可以解释一下我做错了什么吗?

javascript typescript reactjs

7
推荐指数
1
解决办法
3261
查看次数

等效于 javafx 中的 CSS box-sizing

我正在构建一个 JavaFX 应用程序。在使用 CSS 时,我找不到与普通 CSS中的 box-sizing属性等效的属性;关键是我不希望边框从形状外部占用空间,我希望它包含在它的总宽度中。

我使用了背景插图,它按预期工作,但在动态更改边框的宽度(在这种情况下为内部背景的插图)时有点乏味。有没有办法避免这种情况?

  • 我正在使用 JavaFX 11.0.1

css javafx

7
推荐指数
1
解决办法
230
查看次数

Materialise CSS Framework抛出错误

使用物化0.96.1运行Meteor 1.1.6并且在我一天早上启动流星并获得白屏之前没有问题.控制台(萤火虫)说:

SyntaxError: unterminated string literal
var c = "input[type=text], input[type=passw
Run Code Online (Sandbox Code Playgroud)

在生成的文件中找到 materialize_materialize.js

退回版本历史,我似乎无法找到任何明显的变化,这可能是罪魁祸首.查看源代码,我发现代码各自的代码,但该行实际上已终止:

var c = "input[type=text], input[type=password], input[type=email], input[type=url], input[type=tel], input[type=number], input[type=search], textarea";
Run Code Online (Sandbox Code Playgroud)

其他人都看过这个问题,或者对如何修复它有任何想法?

更新:似乎Meteor正在生成文件,但在上述错误中停止了中间字符串.字符串被截断后,文件继续:

/* Exports */
if (typeof Package === 'undefined') Package = {};
Package['materialize:materialize'] = {
  Materialize: Materialize
};

})();
Run Code Online (Sandbox Code Playgroud)

奇怪的是,这不会发生在我的同事的机器上(他使用的是OSX 10.10.3,而我使用的是Windows 7).

第二次更新:还在Ubuntu 14.04 VM上测试了这个问题,并且没有问题 - 应用程序运行得很好.认为它可能与Windows上的Meteor版本有关,我吹走了我的安装,下载了安装程序,并在我的机器上重新安装了Meteor.你知道什么,它有效.

不会用实际的答案标记这个,因为我不知道问题的原因是什么,除了Meteor本身出了问题 - 我想.

javascript materialize meteor

6
推荐指数
1
解决办法
1082
查看次数

如何设置每页的文档标题?

我实际上是通过设置该pages/_document.js钩子的方式使用该钩子添加Bootstrap和添加jQuery到我的页面的<Head>

export default class MyDocument extends Document {
  render() {
    return (
      <html>
        <Head>
          <title>Default title</title>
          <link rel="stylesheet" href="/static/lib/bootstrap3/css/bootstrap.min.css" />
        </Head>

        <body>
          <Main/>
          <NextScript/>
          <script src="/static/lib/jquery3/jquery-3.3.1.min.js" />
          <script src="/static/lib/bootstrap3/js/bootstrap.min.js" />
        </body>
      </html>
    )
  }
}
Run Code Online (Sandbox Code Playgroud)

现在,我想为页面设置一个不同的标题。可以在<Head>外部使用Document吗?我的意思<div>是这样的:

const ContactPage = () => {
  return (
    <div>
      <Head>
        <title>You better contact us!</title>
      </Head>

      <div className="page-body">...</div>
    </div>
  )
}
Run Code Online (Sandbox Code Playgroud)

并且,如果可能,它将覆盖或合并已设置的内容pages/_document.js吗?

javascript reactjs next.js

6
推荐指数
2
解决办法
7580
查看次数

图像不会在带有参数的路线上加载,但可以在没有参数的路线上加载

您好,由于某种原因,我遇到了一个问题,图像无法在带有参数的路线上加载。然而,在任何没有参数的路线上,它们加载得很好。

例如我加载路线 '/product/:id';

该路由的组件包含此

class Product extends Component {
constructor(props) {
    super(props);

    this.state = {
        product: null
    }
}

componentDidMount() {
    this.fetchProduct();
}

fetchProduct() {
    const { id } = this.props.match.params;

    axios.get(`/api/product/${id}`).then(function (response) {
        this.setState({ product: response.data });
    }.bind(this));
}

renderProduct() {
    let { product } = this.state;

    if (!product) {
        return false
    }
    else {
        return (
            <div className='row'>
                <div className='col-md-5'>
                    <img src={product.main_img} />//this image is not displaying
                    <h5>{product.title}</h5>
                    <p>{product.description}</p>
                </div>
                <div className='col-md-5'>
                    <Form product={product}/>
                </div>
            </div>
        )
    } …
Run Code Online (Sandbox Code Playgroud)

javascript image reactjs react-router react-router-dom

6
推荐指数
1
解决办法
2849
查看次数