잡히지 않은 타입 오류 : vm.name이 함수가 아닙니다.

저는 "Mithril JS"를 배우는 새로운 Frond-end 개발자입니다. MVC 패턴을 사용하여 샘플 로그인 페이지를 만들었습니다. 콘솔 오류가 발생하면 로그인 양식이 작동하지 않습니다.잡히지 않은 타입 오류 : vm.name이 함수가 아닙니다.

Uncaught TypeError: vm.name is not a function

어떻게 해결할 수 있습니까?

index.html을

<!doctype html> 
<html> 
    <head> 
     <meta charset="utf-8"> 
     <title>Mithril Js</title> 
     <link rel="stylesheet" href="css/style.css"> 
     <link rel="stylesheet" href="bower_components/todomvc-common/base.css"> 
     <link rel="stylesheet" href="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css"> 
     <script src="bower_components/mithril/mithril.min.js"></script> 
     <script src="bower_components/todomvc-common/base.js"></script> 
    </head> 
    <body> 
     <section id="MitApp"></section> 
     <script src="js/app.js"></script> 
     <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script> 
     <script src="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script> 
     <script src="js/views/login.js"></script> 
     <script src="js/controllers/todos.js"></script> 
    </body> 
</html>

App.Js (생성 노선도)

var app = app || {}; 

(function(window){ 
    'use strict'; 

    app.ENTER_KEY = 13; 
    app.ESC_KEY = 27; 

    m.route.mode = "hash"; 

    m.route(document.getElementById('MitApp'), '/', { 
     "/":app, 
     "/:filter":app 
    }); 
})(window);

로그인 양식

var app = app || {}; 



app.view = function(ctrl){ 
    var vm = app; 
    console.log(vm); 
    return[m(".container", {style: {"margin-top": "55px"}}, [ 
      m(".col-md-4.col-md-offset-4", [ 
       m("h4", "Login"), 
       m("form[action=''][enctype='multipart/form-data'][method='post']", [ 
        m(".form-group", [ 
         m("input.form-control[placeholder='Username'][type='name']", {value:vm.name(), onchange:m.writeAttr("value", vm.name)}) 
        ]), 
        m(".form-group", [ 
         m("input.form-control[placeholder='Password'][type='password']", {value:vm.password(), onchange:m.writeAttr("value",vm.password)}) 
        ]), 
        m(".form-group", [ 
         m("button.btn.btn-primary.pull-right[id='login'][type='submit']",{onclick:vm.submit.bind(vm)}, "Login") 
        ]) 
       ]) 
      ]), 
      "\ 
" 
     ])] 
}

출처

2016-08-22 Venkatesh Venkatesh

간체 귀하의 로그인 양식에있는 app.view 함수는 vm.name에 대한 참조를 포함하지만 여기에 게시 한 코드 중 어느 것도 vm.name이 무엇인지 정의하지 않습니다. 함수의 두 번째 줄은 console.log(vm)입니다. 따라서 브라우저 콘솔을 열고 vm이 무엇인지 확인해야합니다. 나는, 그리고 코드의 나머지 나는 다음과 같은 참조를 부착 볼 수 있습니다 읽어 vm가 app에 대한 참조 것을 볼 수 있습니다

app.ENTER_KEY = 13; 
app.ESC_KEY = 27; 
app.view = function(){/**/}

를 지금까지 내가, 사람들은 app에 설정된 속성 만이 볼 수 있듯이을/나는 app.view 함수의 내용을 읽을 때 vm하지만, 나는 다음과 같은 추가 속성을 사용할 수있을 것으로 기대 것을 볼 수 있습니다

vm.name 
vm.password 
vm.submit

vm.name 및 m.props 같은 vm.password보고, vm.submit은 분명히 기능입니다 (사용자가 로그인 할 때 기대하는 것이 분명합니다. 그러나 사용자가 어떻게 할 것인지 예상 할 수는 없습니다). 따라서 view을 올바르게 실행하는 방법은 해당 속성을 정의하는 것입니다. App.js에 - - 당신이 app.ENTER_KEY 및 app.ESC_KEY 정의 같은 장소에서 다음을 정의 할 것이다 즉 당신이 당신의 모델을 유지하려는 것 같다 때문에 :

var app = app || {}; 

(function(window){ 
    'use strict'; 

    app.ENTER_KEY = 13; 
    app.ESC_KEY = 27; 

    // Define the extra properties needed for your view: 
    app.name = m.prop('') 
    app.password = m.prop('') 

    app.submit = function(){ 
     // ... 
    } 

    m.route.mode = "hash"; 

    m.route(document.getElementById('MitApp'), '/', { 
     "/":app, 
     "/:filter":app 
    }); 
})(window);

을

출처

2016-08-22 07:53:41 Barney

잡히지 않은 타입 오류 : vm.name이 함수가 아닙니다.

답변

관련 문제