小编par*_*ite的帖子

Aurelia中的打字稿自动注入

我是Typescript和Aurelia的新手.我试图让@autoinject装饰器在VS2015 ASP.NET MVC 6项目中工作.

这是我的代码

import {autoinject} from "aurelia-framework";
import {HttpClient} from "aurelia-http-client";

@autoinject()
export class App {
       http: HttpClient;
       constructor(httpClient: HttpClient) {
          this.http = httpClient;
       }

       activate() {
          this.http.get("/api/test/")...
       }
}
Run Code Online (Sandbox Code Playgroud)

当我运行这个时,我得到一个错误,说this.http是未定义的.

我相信我需要添加TypeScript的emitDecoratorMetadata标志,但我不知道如何.

我已经尝试将tsconfig.json文件添加到我的项目中并在编译器选项中设置该标志,但后来我得到了一堆错误(重复标识符).我该如何解决这些错误.我需要在"文件"中添加内容吗?到底是什么?

这是我的config.js文件

System.config({
  baseURL: "/",
  defaultJSExtensions: true,
  transpiler: "typescript",
  paths: {
    "npm:*": "jspm_packages/npm/*",
    "github:*": "jspm_packages/github/*"
  },

  map: {
    "aurelia-bootstrapper": "npm:aurelia-bootstrapper@1.0.0-beta.1",
    "aurelia-framework": "npm:aurelia-framework@1.0.0-beta.1.0.7",
    "aurelia-http-client": "npm:aurelia-http-client@1.0.0-beta.1",
    "typescript": "npm:typescript@1.7.5",
     ....
  }
  });
Run Code Online (Sandbox Code Playgroud)

javascript typescript aurelia

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

为什么 Blazor 渲染组件两次

我有一个简单的 Blazor 组件。

<div @onclick="HandleClick">Click me</div>

@code {

    public async Task HandleClick()
    {
        await Task.Run(()=> System.Threading.Thread.Sleep(1000));
    }

    protected override void OnAfterRender(bool firstRender)
    {
        Console.WriteLine("Rendered");
    }
}
Run Code Online (Sandbox Code Playgroud)

当我单击 div 时,“Rendered”被打印到控制台,并在 1 秒后再次打印,这意味着 blazor 已渲染组件两次。我知道 Blazor 会触发组件的自动重新渲染,作为向其分派事件的一部分。

但是为什么它在任务完成后重新渲染?如何避免二次渲染?

我在 OnAfterRender 生命周期钩子中有一些 JS 互操作,现在运行两次。我可以添加某种计数器,但这会污染我的代码,我想避免这种情况。我HandleClick是一个简单的 public void 方法,然后一切正常,但这并不总是可能的

blazor blazor-server-side blazor-client-side

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

基类中的Autofac属性注入

我正在开发Windows Phone 8.1应用程序,我有一个带有公共属性的基类.

public class ViewModelBase
{
   public ISomeClass MyProp {get;set;}
}
Run Code Online (Sandbox Code Playgroud)

我的派生类看起来像这样

public class MainViewModel : ViewModelBase
{
    private readonly INavigation _navigation;
    public MainViewModel(INavigation navigation)
    {
        _navigation = navigation;
    }
}
Run Code Online (Sandbox Code Playgroud)

在我的App.cs中我有

 var builder = new ContainerBuilder();
 builder.RegisterType<Navigation>().As<INavigation>();
 builder.RegisterType<SomeClass>().As<ISomeClass>();
 builder.RegisterSource(new AnyConcreteTypeNotAlreadyRegisteredSource());
Run Code Online (Sandbox Code Playgroud)

创建MainViewModel时,我的INavigation已解析,但MyProp为null.我试过了

builder.Register(c => new ViewModelBase { MyProp = c.Resolve<ISomeClass>() });

builder.Register(c => new ViewModelBase()).OnActivated(e => e.Instance.MyProp = e.Context.Resolve<ISomeClass>());

builder.RegisterType<ViewModelBase>().PropertiesAutowired();
Run Code Online (Sandbox Code Playgroud)

但它都不起作用!

解决方案发布在这里 http://bling.github.io/blog/2009/09/07/member-injection-module-for-autofac/

有效,但我不喜欢它:)

在这种情况下我不想使用构造函数注入.

谢谢.

c# dependency-injection autofac

5
推荐指数
2
解决办法
6056
查看次数

加载aurelia-validation插件时出错

我正在尝试在我的项目中设置aurelia-validation插件.我正在使用VS2015.我已经使用jspm install aurelia-validation命令安装了aurelia-validation插件.

Config.js文件已更新"aurelia-validation":"github:aurelia/validation@0.2.7",在jspm_packages/github中我看到了validation@0.2.7文件夹.

我在main.js文件中添加了一个插件.

export function configure(aurelia) {

    aurelia.use
        .standardConfiguration()
        .developmentLogging()
        .plugin('aurelia-validation');

    aurelia.start().then(a => a.setRoot());
}
Run Code Online (Sandbox Code Playgroud)

并将我的aurelia-app更改为aurelia-app ="main"

当我启动应用程序时,我在Firefox控制台中收到以下错误:

Unhandled promise rejection TypeError: aurelia.globalizeResources is not a function
Stack trace:
configure@http://localhost:15724/jspm_packages/github/aurelia/validation@0.2.7/index.js:28:5
loadPlugin/<@http://localhost:15724/jspm_packages/github/aurelia/framework@0.15.0/aurelia-framework.js:34:32
run@http://localhost:15724/jspm_packages/npm/core-js@0.9.18/modules/es6.promise.js:91:43
notify/<@http://localhost:15724/jspm_packages/npm/core-js@0.9.18/modules/es6.promise.js:105:11
module.exports@http://localhost:15724/jspm_packages/npm/core-js@0.9.18/modules/$.invoke.js:6:25
@http://localhost:15724/jspm_packages/npm/core-js@0.9.18/modules/$.task.js:40:9
run@http://localhost:15724/jspm_packages/npm/core-js@0.9.18/modules/$.task.js:27:7
listner@http://localhost:15724/jspm_packages/npm/core-js@0.9.18/modules/$.task.js:31:5
Run Code Online (Sandbox Code Playgroud)

我试过用jspm cc命令清除jspm缓存,但这没有用.我的所有包裹都是最新的.

我错过了什么?

谢谢.

javascript aurelia aurelia-validation

5
推荐指数
2
解决办法
1266
查看次数

Blazor 如何创建动态表单

我正在尝试在 Blazor 中创建一个动态表单,但我被卡住了。我有一个 FormFactory 组件,它接受两个输入参数。我的数据绑定模型和定义应创建哪些元素的字典。这个想法是传递一个模型对象

public class Data 
{
    public string Name { get; set; }
    public string Phone { get; set; }
    public string Address { get; set; }
}
Run Code Online (Sandbox Code Playgroud)

和字典

{ "Name": "string" },
{ "Phone": "string" }
Run Code Online (Sandbox Code Playgroud)

我想创建一个表单,其中包含两个绑定到模型中属性的 Name 和 Phone 输入字段。

<h3>Dynamic form</h3>
<EditForm Model="@DataContext">
    @foreach (var field in FieldIdentifiers)
    {
        if (field.Value == "string")
        {
            <InputText @bind-Value="DataContext.GetType().GetProperty(field.Key).GetValue(DataContext, null).ToString()"></InputText>
        }
    }    
</EditForm>    
@code {    
    [Parameter] public object DataContext { get; set; }
    [Parameter] public Dictionary<string, string> …
Run Code Online (Sandbox Code Playgroud)

blazor blazor-client-side

5
推荐指数
2
解决办法
7049
查看次数

React Context API 很慢

我正在尝试新的 Context API 和钩子。我创建了一个带有侧边栏(树视图)、页脚和主要内容页面的应用程序。我有一个上下文提供者

const ContextProvider: FunctionComponent = (props) => {

const [selected, setSelected] = useState(undefined);
const [treeNodes, setTreeNodes] = useState([]);

return (
    <MyContext.Provider
        value={{
            actions: {
                setSelected,
                setTreeNodes
            },
            selected,
            treeNodes
        }}
    >
        {props.children}
    </MyContext.Provider>
);
Run Code Online (Sandbox Code Playgroud)

在我的内容组件中,我有一个包含大约 1000 个项目的详细信息列表(Office Fabric UI)。当我单击列表中的项目时,我想在上下文中更新所选项目。这可行,但速度确实很慢。选择列表中的项目大约需要 0.5-1 秒。该列表是虚拟化的。我已经在生产版本中尝试过了。情况好一点,但单击列表时有明显的滞后。页脚正在使用 myContext 来显示有关所选项目的信息。

这是我的组件中的一些代码

const cntx = useContext(MyContext);

const onClick = (item) => {
    cntx.actions.setSelected(item);
};
Run Code Online (Sandbox Code Playgroud)

我使用的上下文错误吗?

我创建了一个示例沙箱来演示。您可以滚动到大约第 100 个索引,然后单击几次以查看它如何变得无响应。

https://codesandbox.io/s/0m4nqxp4m0

这是 Fabric DetailsList 的问题吗?它会重新渲染很多次吗?我相信问题出在“复杂”DatePicker 组件上,但我不明白为什么DetailsList 会被重新渲染?它没有在渲染函数中使用任何上下文属性。我希望只有页脚组件在每次上下文更改时重新渲染

reactjs office-ui-fabric react-context react-hooks

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