小编Con*_*ila的帖子

我正在寻找合并一个阵列中所有对象的最佳解决方案

const arrayOfObjects = [
 {name: 'Fred', surname: 'Shultz'}, {name: 'Anne', surname: 'Example'}
];

我想实现: {name: ['Fred', 'Anne'], surname: ['Example', 'Shultz']}

什么是最好的选择(es6)？也许我可以用lodash做那样的事情？我应该使用哪些助手？

所以我已经阅读了所有有关在 Firestore 数据库中增加计数器的文档。我有这个代码

const admin = require("firebase-admin");
const db = admin.firestore();
...
db
.collection("settings")
.doc("totalUsers")
.set({
count: firebase.firestore.FieldValue.increment(1),
});

我只是根本不增加计数器。没有错误没有日志什么也没有。在我的 Firestore 中，我有一个集合settings和一个文档totalUsers，其属性count是数字类型且等于 1。

难道我做错了什么？我错过了什么吗？任何帮助表示赞赏！

因此，我有一个数据数组，并且正在使用该数据生成组件列表。我想在每个生成的元素上都有一个引用来计算高度。我知道如何使用Class组件执行此操作，但是我想使用React Hooks进行操作。

这是一个说明我要做什么的示例：

import React, {useState, useCallback} from 'react'
const data = [
  {
    text: 'test1'
  },
  {
    text: 'test2'
  }
]
const Component = () => {
  const [height, setHeight] = useState(0);
  const measuredRef = useCallback(node => {
    if (node !== null) {
      setHeight(node.getBoundingClientRect().height);
    }
  }, []);

  return (
    <div>
      {
        data.map((item, index) => 
          <div ref={measuredRef} key={index}>
            {item.text}
          </div>
        )
      }
    </div>
  )
}

我在vue.js中遇到有关“未捕获的TypeError：'instanceof'的右侧不是对象”的问题。

我正在使用Vue 2.2.1版本，以下是我遇到此问题的代码段。

Vue.component('componentName', {
'template': ``,
 props: {
  contentTypeUid: {
    type: 'string',
    required: false
  },
  limit: {
    type: 'number',
    required: false,
    default: 10
  }
 },
 ......
});

虽然如果不是在上面进行下面的工作没有任何问题，但是我想使用上面的格式，因为我需要在道具上指定一些验证和默认值。

Vue.component('componentName', {
'template': ``,
 props: ["contentTypeUid", "limit"],
 ......
});

谢谢。

我有一个专注于输入的指令。我想测试该指令。唯一的问题是我找不到如何测试输入是否聚焦的问题

这是我简单的模拟组件

 <template>
  <div v-directive>
    <input/>
  </div>
</template>

这是我的指令：

import Vue from 'vue'

export const focusInput = () => {
  return {
    inserted(el: any) {
      el.getElementsByTagName('input')[0].focus()
    }
  }
}

export default Vue.directive('focus-input', focusInput())

这是我的测试：

import Vue from 'vue'
import { mount , createLocalVue} from '@vue/test-utils'

import FocusInputMock from './mockComponents/FocusInputMock.vue'
import {focusInput} from '@/directives/focusInput';

const localVue = createLocalVue()

localVue.directive('directive',  focusInput())


test('update content after changing state', () => {
  const wrapper = mount(FocusInputMock, {
    localVue
  })
  Vue.nextTick(function () {
    expect(wrapper.find('input')) // I …

我是 Angular 6 的新手，我的网站包含一个部分，其中显示一组动态形成的按钮，如下所示

<button class="card-button" *ngFor="let env of product.env" name="button">{{env.name}}</button>

另外，我想显示默认选择的按钮的不同边框

button:focus {
      border-bottom: 4px solid #CC292B;
      color: #CC292B;
}
button{
      border-bottom: 4px solid green;
      color: green;
}

现在，如果按钮被选中，它应该出现，color: #CC292B;否则为绿色。通过上面的CSS，我能够完成任务。现在我希望默认选择第一个按钮，即第一个按钮应该color: #CC292B;以绿色显示并以绿色显示，我该如何实现？提前致谢

我试图用create-react-app-typescript创建一家商店。一切都很好.....但是，此错误发生了，“参数'props'隐式具有'any'类型”，我在互联网上找到了解决方案...建议为props创建一个接口。但是我真的不知道那个物体有什么，所以我什至不能做...

任何帮助表示赞赏！（我是TypeScript的新手）

import * as React from 'react';
import { connect } from "react-redux";
import mapStateToProps from "./utilities/mapStateToProp";

class App extends React.Component {
  constructor(props){
    super(props);
  }

  public render() {
    return (
      <div className="App">
        <h1>Go Type React</h1>
      </div>
    );
  }
}

export default connect(mapStateToProps)(App);

我有一个包含数字58391的Excel单元格。是否有一个公式可以计算（计算数量）另一个单元格中的数字（5 + 8 + 3 + 9 + 1）？

我的Angular4 页面中有两个选项卡（PrimeNg Tabview），其中包含许多输入字段，例如textboxes、textareas、下拉列表等。我还有一个侧边菜单栏可以导航到应用程序中的其他页面。我想如果这些输入字段中的数据有任何更改，那么如果用户尝试更改选项卡或使用侧面导航到其他页面，则会出现一条弹出消息（模式或确认框）菜单栏。

ngOnDestroy()方法我试过了。虽然此方法仅在页面关闭时触发（通过导航到其他页面或移动到下一个标签页），但它不允许您从方法中显示模式/确认框，因为它处于销毁生命周期挂钩.

请帮助我确定实际事件，如果页面/表单中的任何输入字段发生更改，我可以使用该事件向用户提示确认框。

@surjit 建议：

my-guard.service.ts：

export interface CanComponentDeactivate {
    CanDeactivate: () => Observable<boolean> | Promise<boolean> | boolean;
}

@Injectable()
export class CreateRequestGuardService implements CanDeactivate<CanComponentDeactivate> {
    canDeactivate(component: CanComponentDeactivate) {
        let vDeactivate = component.CanDeactivate ? component.CanDeactivate() : true;
        return vDeactivate;
    }   
}

在my-component.ts 中：

import { CreateRequestGuardService } from './my-guard.service';

canDeactivate(): Observable<boolean> | boolean {
    console.log('I am moving away!');
    if (!this.isSaved) {
        const confirmation = window.confirm('Are you …

我有这个代码：

    <span class="glyphicon glyphicon-search"></span>\n    @Html.TextBox("text", Model.Search.text, new {placeholder = Html.T("\xd0\x9f\xd0\xbe\xd0\xb8\xd1\x81\xd0\xba"), @class = "form-control"})\n

结果是：

如果用户输入一些文本并按 Enter 键，则可以正常工作。搜索工作正常。但“搜索”按钮不起作用。它只是停留且不可点击。如何使“搜索”按钮可点击而不丢失外观？

我有一个使用 Vue CLI 3.0.4 的全新 VueJs 项目脚手架我想在所有组件中使用 SCSS 变量，而不必_variables.scss在所有组件中导入。我想导入_variables.scss，我发现可以通过使用 sass-resource-loader 来完成。我查看了这里的所有答案，所有答案都已过时，因为它们不适用于 vue-loader 15。

所以里面vue.config.js我有以下内容：

var path = require('path');
module.exports = {
  chainWebpack: (config) => {
    config.module
      .rule('sass')
      .use('sass-resources-loader')
      .loader('sass-resources-loader')
      .options({
        resources: [
          path.resolve('./src/scss/config/_variables.scss'),
        ]
      })
  }
}

当我运行它时，我收到以下错误：

Module build failed (from ./node_modules/sass-loader/lib/loader.js):

undefined
        ^
      Undefined variable: "$brand-color".
      in C:\dev\git\vue-typescript-test\src\components\HelloWorld.vue (line 60, column 10)

在 Helloworld.vue 组件中使用了 $brand-color 变量，因此它接缝未添加变量。

我似乎无法理解为什么它不起作用，因为我按照这封信遵循了 Vue CLI 中的文档。

另外我想指出，我遵循了这里选择的答案：Vue CLI 3 sass-resources-loader - Options.loaders undefined

非常感谢任何帮助。

谢谢！