小编dud*_*ude的帖子

假设您在ES6类(文档)中有以下代码:

/**
 * @typedef Test~options
 * @type {object.<string>}
 * @property {array} elements - An array containing elements
 * @property {number} length - The array length
 */

/**
 * @param  {Test~options} opt - Option object
 */
test(opt){

}

现在我想记录另一个函数,让我们给它命名test2.此函数采用完全相同的options对象,但需要另一个属性parent.

如何记录这一点而不记录冗余选项？冗余意味着:

/**
 * @typedef Test~options
 * @type {object.<string>}
 * @property {array} elements - An array containing elements
 * @property {number} length - The array length
 */

/**
 * @param  {Test~options} opt - Option object
 */
test(opt){ …

我的应用程序使用Touch API来检测JavaScript中的触摸事件.例:

$(".element").on("touchstart", function(event){
    alert("TRUE");
});

这适用于任何具有Android或iOS等浏览器的触摸设备,但在带有或不带有连接键盘的Windows 10平板电脑上无法在MS Edge中使用.似乎支持API:兼容性列表.但是,我已经测试过了:'ontouchstart' in window这个设备返回false.此外mousedown似乎被解雇了.

这里发生了什么？如何在Windows 10平板电脑上触发触摸事件？我想仅为触摸设备保留活动.切换到指针事件API也包括桌面设备,这不是我想要的.

我想实现一个动画来淡化部分,就像在这个例子中一样,淡入我的应用程序.因此我看了一下fullPage.js.

但是,因为我需要将它集成到具有服务器端呈现的Next.js React应用程序中,所以我不能使用它,因为它在jQuery上进行中继,它不支持SSR.因此,我已经尝试过使用ScrollMagic,它不会在jQuery上转发.但它也不支持SSR(需求window),因此我已经在componentDidMount()方法中对其进行了初始化,甚至将其加载到那里(就像这里推荐的那样).

它目前最初工作,但是一旦你更改页面并完成一个AJAX请求并且Next.js替换了页面,就会抛出一个错误(见下文):

找不到节点

我试图在AJAX请求之前销毁ScrollMagic componentWillUnmount(),但没有运气.我无法弄清楚什么是错的,不幸的是,我找不到任何关于使用React或Next.js的ScrollMagic的文档.

这是我的整个组成部分:

import React from 'react';
import PropTypes from 'prop-types';

class VerticalSlider extends React.Component {
  constructor(props) {
    super(props);
    this.ScrollMagic = null;
    this.controller = null;
    this.scenes = [];
    this.container = React.createRef();
  }

  componentDidMount() {
    if (this.container.current) {
      // Why "require" here?
      // https://github.com/zeit/next.js/issues/219#issuecomment-393939863
      // We can't render the component server-side, but we will still render
      // the HTML
      // eslint-disable-next-line global-require
      this.ScrollMagic = …

我需要一个跨浏览器的解决方案来删除本机选择字段的填充/文本缩进.使用padding: 0似乎并没有完全删除它.

这是Chrome的屏幕截图,左侧没有文字空间:

这是Firefox的截图,左侧有一些文本空间:

但是,它也应该删除例如Edge/IE11/Safari等中的填充.因此它不应该是Firefox唯一的解决方案,而是跨浏览器解决方案.

这是代码:

select {
  font-size: 18px;
  height: 38px;
  line-height: 38px;
  padding: 0;
  width: 100%;
  background-color: red;
  color: #000000;
  display: block;
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  outline: 0;
  border-color: #000000;
  border-width: 0 0 1px 0;
  border-style: solid;
}

option {
  padding: 0;
}

<select>
  <option value="test1">Test 1</option>
  <option value="test2">Test 2</option>
  <option value="test3">Test 3</option>
</select>

小提琴:https://jsfiddle.net/cbkopypv/1/

我@font-face在CSS 中遇到了麻烦.我使用的字体在每个浏览器中看起来都非常不同.

在Firefox中查看此示例:

在Chrome中:

我不知道是什么原因引起了这个问题.我已经尝试使用text-rendering,我也尝试url在@font-face声明中更改-properties 的顺序.

我使用的是Windows 7 Professional和Firefox V30.

有人可以告诉我这个问题的原因,并告诉我如何解决它？

非常感谢.

//编辑:这是@font-face我正在使用的声明:

@font-face {
    font-family: 'MyFont';
    src: url('myFont.eot');
    src: url('myFont.eot?#iefix') format('embedded-opentype'),
        url('myFont.svg#myfont') format('svg'),
        url('myFont.woff') format('woff'),
        url('myFont.ttf') format('truetype');
    font-style: normal;
    font-weight : normal;
}

正如我上面所写,我已经按照这个命令的顺序玩了.

在我的特定问题中,您可以看到此页面(页脚)显示问题.

这是我的意见:

<input type="number" value="{{ bom.Id._Value }}" name="id" data-ng-model="bom.Id._Value" data-ng-blur="myClass.myFunc();" required>

如果我通过this或angular.element(this)在ng-blur中,我没有得到函数中的输入元素.我想要的是接收myFunc()中的当前输入元素作为参数.它的标准方法是什么？

我有一个无序的列表,如:

<ul>
    <li>Element one
        <ul>
            <li><a>Element two</a>
                <ul>
                    <li><a>Element three</a></li>
                </ul>
            </li>
        </ul>
    </li>
</ul>

现在,如果我尝试选择<a>"元素二" 的元素.我会像下面这样做:

ul ul li:first-child > a

这将选择以下嵌套<a>元素.看到这个小提琴:

http://jsfiddle.net/38ksdpw3/

怎么解决这个问题？

我想找findme一个孩子最近的属性链接.startpoint.结构体:

<ul>
    <li><a href="#">Point one</a></li>
    <li><a href="#" data-findme="yipi">Point one</a>
        <ul>
            <li><a href="#">Hello</a></li>
            <li><a href="#">Hello</a>
                <ul>
                    <li><a href="#" class="startpoint">My Startpoint</a></li>
                </ul>
            </li>
        </ul>
    </li>
</ul>

JavaScript(jQuery):

$(document).ready(function(){
    console.log(
        $('.startpoint').closest("*[data-findme]")
    );
});

由于问题是,该元素data-findme不是父元素而是父元素的另一个子元素,我的示例将找不到该元素.例子:http://jsfiddle.net/rjhgvxoe/

我怎样才能让它发挥作用？

这个答案就像以前的魅力一样:

/sf/answers/2872910631/

但是,由于Webpack v4它不再起作用.从那以后它抛出:

错误:webpack.optimize.UglifyJsPlugin已被删除,请改用config.optimization.minimize.

为了使它在Webpack v4中运行,有什么必要？

我没有运气就试过使用以下内容:

const uglifyJsPlugin = require('uglifyjs-webpack-plugin');

if (process.argv.indexOf('-p') !== -1) {
  // compress and remove console statements. Only add this plugin in production
  // as even if drop_console is set to false, other options may be set to true
  config.plugins.push(new uglifyJsPlugin({
    compress: {
      'drop_console': true
    }
  }));
}

我有一个带有延迟加载模块和路由的普通 Angular 10 应用程序。但是，我有一个特殊的要求需要满足。

在大多数页面上，我想通过<app-root>在 index.html 中嵌入元素来使用路由等初始化完整的应用程序——这是AppComponent. 另一方面，在某些页面上，不应该初始化完整的应用程序，而应该只初始化一个<header-search>我使用 @angular/elements（Web 组件）注册的特定组件。这也意味着在这种情况下，除了<header-search>初始化（如果它不是由<header-search>组件本身嵌入）之外，不应该发生路由，也不应该发生任何其他组件。

旁注只是为了让您了解用例的背景：在我正在构建的项目中，并非所有部分都与 Angular 解耦。一些页面使用 Twig/PHP 在后端呈现。但是我需要使用 Angular 构建的标题中的搜索功能也可以在这些页面上使用。这意味着我不会同时拥有完整的应用程序，只有HeaderSearchComponent在这种情况下。然而，在其他页面上，完整的应用程序将被初始化，包括HeaderSearchComponet，因此不需要使用 Web 组件单独嵌入 - 在这种情况下， <app-root>元素就足够了。

我的想法在哪里使用角度元素将HeaderSearchComponent作为<header-search>自定义 Web 组件注册，例如：

@NgModule({
  imports: [BrowserModule, FormsModule, SharedModule],
  declarations: [AppComponent],
  bootstrap: [AppComponent],
  entryComponents: [HeaderSearchComponent]
})
export class AppModule implements DoBootstrap {
  constructor(injector: Injector) {
    const webComponent = createCustomElement(HeaderSearchComponent, {
      injector
    });
    customElements.define("header-search", webComponent);
  }

  public ngDoBootstrap(): void {}
} …