Mô hình xem dao cạo sang javascript

Thực tiễn phổ biến để di chuyển dữ liệu giữa bộ điều khiển và chế độ xem trong ASP. NET MVC là sử dụng một mô hình xem. Mặc dù việc sử dụng mô hình chế độ xem từ bên trong trang ASPX của chế độ xem khá dễ dàng, nhưng việc sử dụng nó từ JavaScript có thể phức tạp hơn. Mặc dù các khối JavaScript được khai báo nội tuyến trên trang xem có thể dễ dàng sử dụng các giá trị từ mô hình, nhưng các tệp tập lệnh bên ngoài không thể. Để tận dụng lợi thế của việc giảm thiểu và thu nhỏ tập lệnh, bạn nên tránh sử dụng các khối tập lệnh nội tuyến và thay vào đó hãy sử dụng các tệp JavaScript bên ngoài [. js]. Điều gì sẽ xảy ra khi bạn cần tham chiếu một giá trị từ mô hình chế độ xem trong JavaScript của mình? . NET, họ không thể tận dụng Mô hình; .  

Tôi đã phải vật lộn với giới hạn này kể từ lần phát hành bản xem trước đầu tiên của ASP. NET MVC. Dưới đây là một số cách tiếp cận mà tôi đã thử [và ghét]

Đặt tập lệnh trong chế độ xem một phần

Thay vì làm theo các phương pháp hay nhất và đặt JavaScript trong tệp tập lệnh bên ngoài, thay vào đó, tập lệnh có thể được đặt trong chế độ xem một phần. Điều này đơn giản hóa chế độ xem chính bằng cách đóng gói tập lệnh và nó cho phép sử dụng lại tập lệnh. Nó cũng cho phép tập lệnh dễ dàng tham chiếu các giá trị từ mô hình xem.  



    
    alert['Hello from the view model: '];
    

Nhược điểm của phương pháp này là tập lệnh không thể được thu nhỏ hoặc kết hợp dễ dàng và trình duyệt không thể lưu vào bộ đệm vì nó thực sự được hiển thị nội tuyến trong đánh dấu cuối cùng do chế độ xem tạo ra.  

Truyền thuộc tính mô hình xem thông qua chức năng khởi tạo

Một cách tiếp cận khác mà tôi đã sử dụng là xác định hàm khởi tạo trong các tệp JavaScript bên ngoài của mình. Bất kỳ giá trị nào mà tập lệnh cần đều có thể được trích xuất từ ​​​​mô hình trong chế độ xem chính, sau đó được chuyển đến JavaScript bên ngoài thông qua chức năng khởi tạo

...


    var name = "";
    ExternalScript_Init[name];

...

//Contents of ExternalScript.js
ExternalScript_Init[name] {
    alert["Hello from JavaScript: " + name];
}

Cách tiếp cận này cũng ít hơn lý tưởng. Bất kỳ giá trị nào mà tập lệnh yêu cầu phải được trích xuất thủ công từ mô hình chế độ xem, điều này khiến việc bảo trì trở nên đau đầu hơn mức cần thiết.  

giải pháp lý tưởng

Hai cách tiếp cận trước đó "làm việc", nhưng chúng đều có nhược điểm. Giải pháp lý tưởng sẽ cho phép các tệp JavaScript bên ngoài dễ dàng sử dụng mô hình trong một lượng công việc thủ công tối thiểu. Việc thêm thuộc tính mới vào mô hình chế độ xem sẽ không yêu cầu JavaScript để hiển thị thuộc tính mới để tập lệnh sử dụng. Hóa ra điều này thực sự khá dễ thực hiện…

đúng cách. tuần tự hóa mô hình thành JavaScript

MẠNG 3. 5 đã giới thiệu lớp JavaScriptSerializer để tuần tự hóa các đối tượng đến/từ JSON. Với nó, hầu hết. NET có thể dễ dàng chuyển đổi thành một dạng mà JavaScript có thể dễ dàng sử dụng. Scott Gu đã giới thiệu một phương thức mở rộng ToJSON đơn giản trên blog của mình, phương thức này có thể được sử dụng để chuyển đổi mô hình chế độ xem thành JSON. Khi đầu ra của phương thức này được gán cho một biến JavaScript, các thuộc tính của mô hình chế độ xem sẽ thực sự khả dụng cho tập lệnh phía máy khách [lưu ý rằng các phương thức được xác định trên mô hình chế độ xem, nếu có, sẽ bị JavaScriptSerializer bỏ qua].  

...
    
        var Model = 
        //If needed, new properties can be added to the model, such as URLs for AJAX requests:
        Model.MyAjaxMethod = ' c.DoAjaxyThing[]] %>';        
    

Khối mã trên sẽ xuất hiện trước bất kỳ tập lệnh nào muốn truy cập các thuộc tính từ mô hình chế độ xem, có thể dễ dàng tham chiếu các thuộc tính của mô hình chế độ xem

    
    alert["Hello from the JSON view model:" + Model.Hello];
    

Đây là một cải tiến lớn so với hai cách tiếp cận khác mà tôi đã thử [ít nhất là theo ý kiến ​​​​của tôi], nhưng nó vẫn yêu cầu tôi thực hiện tác vụ tuần tự hóa thông thường này trên mỗi chế độ xem. Một cải tiến dễ dàng là di chuyển nó đến trang chính

Bạn có thể sử dụng JavaScript với Razor không?

Bạn có thể gọi các phương thức JavaScript từ các trang Blazor với sự trợ giúp của JavaScript Interop bằng cách đưa phần phụ thuộc IJSRuntime vào trang dao cạo . Sau đó tham khảo tập lệnh trong trang HTML của ứng dụng blazor.

@model thể hiện điều gì trong chế độ xem Dao cạo?

@Model sẽ chứa tất cả dữ liệu của trang hiện tại . Vì vậy, khi bạn truy cập một trang trên trang web của mình, bạn có thể lấy dữ liệu từ trang đó bằng cách sử dụng @Model.

Chế độ xem một phần có thể có JavaScript không?

Các hàm JavaScript có thể được liên kết với các thành phần trên chế độ xem một phần ; . Điều này xảy ra khi tải chế độ xem một phần bằng @Html. Phương pháp trợ giúp hành động, như trong phần này từ Chỉnh sửa.

Trang Razor là MVC hay MVVM?

Mẫu mô hình khung nhìn được sử dụng rộng rãi trong phát triển ứng dụng MVC, nơi nó chủ yếu biểu thị dữ liệu, nhưng thường có rất ít hành vi. Trong Razor Pages, PageModel cũng là kiểu xem. Trang Dao cạo đôi khi được mô tả là triển khai mẫu MVVM [Mô hình, Chế độ xem ViewModel] .

Chủ Đề