奥里利亚 - 在路由器看法，如果我改变路由器视图选项卡

Question

我的形式不断复位禁用复位，有没有办法防止这种情况（如果不是出了什么替代）

export class App { 
configureRouter(config, router) { 
config.title = "Aurelia"; 
config.map([ 
    { route: ["", "dashboard"], name: "dashboard", moduleId: "HTML/viewmodels/dashboard", nav: true, title: "Dashboard", settings: "icon-home" }, 
    { route: "addons", name: "addons", moduleId: "HTML/viewmodels/addons", nav: true, title: "Addons", settings: "icon-file" }, 
    { route: "error", name: "error", moduleId: "HTML/viewmodels/error", nav: true, title: "Error", settings: "icon-info-sign" } 
]); 

this.router = router; 
console.log(router); 
    } 
} 

Answer 1

这是一个国家持续存在问题。最简单的解决方案是将保存在状态：

• 的父视图
• 甲非观看相关的单独的类（或静态变量）
• localStorage的持续（可能与前一选项一致）

---

第一种方法：将其保存在父视图中。

例如，您可以创建App类中的缓存：

export class App { 
    formData = {}; 

    configureRouter(config, router) { 
    { route: ["", "dashboard"], [..snip..] settings: { formData: this.formData, icon: 'icon-home' } } 
    } 
} 

内，您的观点，您就可以这样做：

activate(params, routeConfig) { 
    this.formData = routeConfig.settings.formData; 
    this.icon = routeConfig.settings.icon; 
} 

而在HTML，只是将其绑定到formData：

<input type="text" value.bind="formData.text" /> 

这种假设，临时整个App围绕这种形式。否则，将它存储在那里并不太合理。无论如何（我在列表中指出的第一个方法）就是这样做的一种方法。

---

另一种方法：单身。

创建一个名为AppState的新类或其他类。

export class AppState { 
    formData = {}; 
} 

那么在你看来，你应该导入并注入它：

import { AppState } from './app-state'; 

export class YourView { 
    static inject = [AppState]; 

    constructor(appState) { 
    this.appState = appState; 
    } 
} 

然后在你的HTML，你可以像这样将它绑定：

<input type="text" value.bind="appState.formData.text" /> 

---

或者第三种方式：静态类。

创建一个名为AppState的新类或其他类。

export class AppState { 
    static formData = {}; 
} 

然后，在你看来，你应该导入并注入它： 进口{}届时AppState从”。/应用程序状态';

export class YourView { 
    AppState = AppState; 
} 

然后在你的HTML，你可以像这样将它绑定：

<input type="text" value.bind="AppState.formData.text" />