0

我是 sencha 的新手，我正在尝试使用 ctrl 将数据从一个页面传递到另一个页面到 ctrl，onclick 提交按钮的值应该携带到另一个页面视图

注册页面查看

Ext.define('sample.view.register.Registration', {
extend: 'Ext.container.Container',
xtype: 'register',
itemId: 'registers',
layout: 'vbox',
requires: [
    'sample.view.register.RegistrationModel',
    'sample.view.register.RegistrationController',
    'sample.view.user.User',
    'sample.view.user.UserController',
    'sample.store.Personnel'
],
controller: 'register',
viewModel: 'register',
items: [
    {
        xtype: 'container',
        padding: 10,
        items: [{
            xtype: 'textfield',
            fieldLabel: 'User Name',
            name: 'nameReg',
            bind: {
                value: '{formData.nameReg}'
            }
        }, {
            xtype: 'textfield',
            name: 'password1',
            inputType: 'password',
            itemId: 'password1',
            fieldLabel: 'Password',
        },

        {
            xtype: 'button',
            text: 'Submit',
            handler: 'onSubmit'
        }],

    }],

**注册控制器**
Ext.define('sample.view.register.RegistrationController', {
extend: 'Ext.app.ViewController',
alias: 'controller.register',
onSubmit: function () {
    var name = Ext.ComponentQuery.query('#nameReg')[0].lastValue;
    var pass = Ext.ComponentQuery.query('#password1')[0].lastValue;
    var age = Ext.ComponentQuery.query('#age')[0].lastValue;

    const da = this.getViewModel().get('formData');
     console.log(da) // im getting data here user, this data I want to carry to another page( User page )
 // Ext.create('sample.view.user.User', {
    //     id: Ext.id(),
    //     myVariable: store,
    // });

注册
模型页面

Ext.define('sample.view.register.RegistrationModel', {
extend: 'Ext.app.ViewModel',
alias: 'viewmodel.register',
data: {
    formData: {
        nameReg: '',
        pass: null,
    },
    afterSubmit: true,
    //     names: 'sample',
    //     loremIpsum: 'Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.'
},

});
用户页面视图
在这里我想显示数据，它是从 reg 页面携带并将值绑定到输入 

Ext.define('sample.view.user.User', {
xtype: 'user',
extend: 'Ext.form.Panel',
// extend: 'Ext.Container',
extend: 'Ext.container.Container',
itemId: 'userPage',
requires: [
    'sample.view.register.RegistrationController',
    'sample.view.register.RegistrationModel'
],

// viewModel: {
//     data: {
//         title: 'Default Title'
//     }
// },
// initComponent: function () {
//     if (this.title) {
//         console.log('==========', this.title)
//     }
// },


width: 600,
bodyPadding: 10,
// layout: 'form',
autoScroll: 'true',

items: [{
    xtype: 'textfield',
    fieldLabel: 'User Name',
    name: 'nameReg',
    itemId: 'nameReg',
    bind: {
        value: '{formData.nameReg}'
    }
}]

});
在这里我尝试过使用视图模型，但我不知道它是如何工作的，如果您需要更多信息，请告诉我，提前致谢

4

1 回答 1

0

在这种情况下，我基本上有两种选择：

  1. 共享视图模型：只要有意义，就为两个相关视图使用一个视图模型。通过数据绑定，第一个视图将数据写入视图模型，而第二个视图读取相同的数据。所以基本上你将这两个视图模型合并为一个。
  2. 将整体视图模型作为两个视图模型的父类，保存两个视图共享的数据。我们称之为“App.UserModel”。然后，您的两个视图模型应该扩展“App.UserModel”（而不是“Ext.app.ViewModel”）。同样，简单的数据绑定应该可以很好地完成这项工作。
于 2020-06-29T07:51:00.490 回答