小编Unk*_*per的帖子

getElementsByClassName()有两个类

是否可以使用类a b使用getElementsByClassName()一次获取所有元素?我更喜欢vanilla JavaScript.

html javascript dom

61
推荐指数
4
解决办法
4万
查看次数

22
推荐指数
2
解决办法
845
查看次数

在Angular中动态更改styles.scss

我想根据Angular自举之前已知的变量动态应用SCSS样式.是否有可能以styles.scss编程方式进行更改?在main.ts引导之前,我想动态添加一行,如:

@import 'assets/styles/customerA/_themes.scss';
                       or 
@import 'assets/styles/customerB/_themes.scss';
Run Code Online (Sandbox Code Playgroud)

取决于来自服务器的变量值.

如果以上操作不可行,是否有任何方法可以填充styles.scss将在服务器上定义的另一个文件的内容?我想更改styles.scss而不是任何其他"本地"scss文件.

angular

20
推荐指数
2
解决办法
8272
查看次数

如何调用Angular-CLI .NET Core中的index.html?

我使用Visual Studio 2017构建了一个Angular-CLI .Net Core SPA

dotnet new angular -o my-new-app 
Run Code Online (Sandbox Code Playgroud)

我正在努力寻找的是在写入时默认调用文件夹index.html内部的内容ClientApp/src

http://localhost:57782
Run Code Online (Sandbox Code Playgroud)

startup.cs文件如下:

using Microsoft.AspNetCore.Builder;
using Microsoft.AspNetCore.Hosting;
using Microsoft.AspNetCore.SpaServices.AngularCli;
using Microsoft.Extensions.Configuration;
using Microsoft.Extensions.DependencyInjection;

namespace angular_cli
{
    public class Startup
    {
        public Startup(IConfiguration configuration)
        {
            Configuration = configuration;
        }

        public IConfiguration Configuration { get; }

        // This method gets called by the runtime. Use this method to add services to the container.
        public void ConfigureServices(IServiceCollection services)
        {
            //services.AddMvc();

            // In production, the Angular files will be …
Run Code Online (Sandbox Code Playgroud)

asp.net asp.net-mvc asp.net-core angular-cli

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

React Context 性能和建议

您可以在许多网站上找到这个短语,并且它被认为(?)有效:

React Context 通常用于避免 prop 钻探,但众所周知,存在性能问题。当上下文值更改时,所有使用的组件都useContext将重新渲染。

而且:

React 团队提出了一个useSelectedContext钩子来防止大规模 Context 的性能问题。有一个社区库:use-context-selector

然而,对于我来说,上述内容没有任何意义。难道我们不想重新渲染所有使用的组件吗useContext?绝对地!一旦上下文值发生变化,所有使用它的组件都必须重新渲染。否则,UI 将不会与状态同步。那么,性能问题到底是什么

我们可以讨论如何不重新渲染不使用的 Context Provider 的其他子组件useContext,这是可以实现的(react docs):

<TasksContext.Provider value={tasks}>
  <TasksDispatchContext.Provider value={dispatch}>
    {children}
  </TasksDispatchContext.Provider>
</TasksContext.Provider>
Run Code Online (Sandbox Code Playgroud)

通过使用上面的模式,我们可以避免重新渲染所有不使用useContext.

回顾一下:在我看来,正确使用 Context 时不存在性能问题。唯一会重新渲染的组件是那些应该重新渲染的组件。然而,几乎所有参考文献都坚持存在潜在的性能问题,并强调这是 Context 的警告之一。我错过了什么吗?

reactjs react-context

12
推荐指数
2
解决办法
9297
查看次数

Dropzone:阻止上传重复文件

我正在使用Dropzone.我想阻止在Dropzone"面板"中上传已经作为缩略图存在的文件.上传时,我的意思是不允许在面板中显示两次具有相同名称的文件.我不关心服务器中已存在的文件并且未在面板中显示的情况,因为它将被具有相同名称的新文件替换.

尽管我付出了努力,但我无法找到如何实现这一目标.我很感激你的帮助.

非常感谢你

javascript php

10
推荐指数
3
解决办法
1万
查看次数

Angular $ scope.$ digest vs $ scope.$ apply

我只是想知道热使用$digest.在控制器内部,以下代码工作正常,并在3秒后更新DOM:

setTimeout(function(){
    $scope.$apply(function(){
    $scope.name = 'Alice';
    });
},3000);
Run Code Online (Sandbox Code Playgroud)

但是通过使用

setTimeout(function(){
        $scope.$digest(function(){
        $scope.name = 'Alice';
        });
    },3000);
Run Code Online (Sandbox Code Playgroud)

什么都没发生...

我以为他们做同样的事情.我错了什么?

angularjs

10
推荐指数
1
解决办法
2万
查看次数

DOM对象是javascript对象吗?

这是我无法找到官方答案的.对于某些人来说,DOM对象是JS对象,对于其他对象则不同.什么是正确的答案?通过在stackoverflow中搜索,您可能会看到有争议的意见.

例如,对象document.body是仅属于DOM API还是可以被视为javascript引擎的一部分?

Javascript是否创建了它的内部表示,还是只与DOM通信以访问它?

javascript dom

9
推荐指数
2
解决办法
258
查看次数

无法使角度材料居中使用模态窗口

这很疯狂但是以下代码:

import { Component, Inject } from '@angular/core';
import { MatDialog, MatDialogRef, MatDialogConfig, MAT_DIALOG_DATA } from '@angular/material';

@Component({
    selector: 'decline',
    templateUrl: './decline.component.html',
    styleUrls: ['../../../styles/main.css']
})

export class DeclineComponent {

    animal: string;
    name: string;
    config: MatDialogConfig = {
        disableClose: false,
        hasBackdrop: true,
        backdropClass: '',
        width: '250px',
        height: '',
        position: {
            top: '',
            bottom: '',
            left: '',
            right: ''
        }
    };
    constructor(public dialog: MatDialog) { }

    openDialog(): void {
        let dialogRef = this.dialog.open(DialogOverviewExampleDialog, this.config);
    }

}

@Component({
    selector: 'dialog-overview-example-dialog',
    template: `
        This …
Run Code Online (Sandbox Code Playgroud)

angular-material2 angular

8
推荐指数
3
解决办法
6917
查看次数

单线程JavaScript下的动画

JavaScript是单线程语言,因此它一次只执行一个命令.异步编程通过Web API(用于事件处理的DOM,用于AJAX调用的XMLHttpRequest,用于setTimeout的WindowTimers)和由浏览器管理的事件队列来实现.到现在为止还挺好!现在考虑一下,以下非常简单的代码:

$('#mybox').hide(17000);
console.log('Previous command has not yet terminated!');
... 
Run Code Online (Sandbox Code Playgroud)

有人可以向我解释上面的基本机制吗?由于.hide()还没有完成(动画持续17秒)并且JS引擎正在处理它并且它能够一次执行一个命令,它以哪种方式进入下一行并继续运行剩下的代码?

如果您的答案是动画创建了promises,那么问题仍然是:JavaScript如何同时处理多个事物(执行动画本身,在承诺的情况下观察动画队列并继续执行下面的代码). ..).

此外,我无法解释jQuery中的promises如何工作,如果他们必须观察他们的父Deferred对象,直到它被解析或拒绝 ,这意味着代码执行,同时执行剩余的代码.这怎么可能在单线程方法中?理解AJAX调用我没有问题,因为我知道它们被JS引擎带走了......

javascript single-threaded jquery-animate

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