Sự khác biệt giữa jsRender và jsViews

Question

Vì vậy, các mẫu jQuery sẽ không bao giờ có được bản beta trước và jsRender và jsViews được cho là lấp đầy khoảng trống. Tôi đã xem các ví dụ được đăng bởi Boris Moore trên this page nhưng tôi không nhận được sự khác biệt giữa jsRender và jsViews. Hơn nữa Boris đã sử dụng một trong ví dụ của người khác để thêm vào sự nhầm lẫn. Vì vậy, câu hỏi là làm thế nào hai trong số họ có liên quan (hoặc khác nhau)?

Answer 1

JsRender là công cụ tạo khuôn mẫu. JsViews là công cụ liên kết dữ liệu.

JsRender giúp bạn hiển thị HTML bằng mẫu (HTML/CSS tĩnh có mã thông báo được thay thế bằng dữ liệu). Nó hỗ trợ logic đơn giản, các giá trị dựng hình và các hàm tùy chỉnh.

JsViews, được xây dựng trên đầu trang của JsRender, cho biết thêm khả năng quan sát đối tượng/thuộc tính. Điều này cho phép bạn liên kết các đối tượng json của bạn với các mục tiêu HTML và nhận được liên kết dữ liệu 2 chiều.

Có nhiều điều hơn cho họ, tất nhiên, nhưng đó là câu trả lời thứ 60. cái đó có giúp ích không?

Answer 2

jsRender chỉ là các mẫu, trong đó jsViews là các mẫu, nhưng cũng ràng buộc dữ liệu. Vì vậy, nếu bạn chỉ muốn xuất dữ liệu từ một đối tượng, danh sách hoặc lớp, thì bạn sẽ sử dụng jsRender. Do đó, kết xuất một mẫu. jsViews, sẽ cho ràng buộc dữ liệu thời gian thực, trong số nhiều tính năng tuyệt vời khác. Vì vậy, nếu bạn đưa ra một mẫu sử dụng nó, và đã có một lĩnh vực được databound, khi bạn sửa đổi nó ở phía khách hàng, nó thực sự là sửa đổi các đối tượng mà bạn đã nhận nó từ.

Ví dụ: đây là cách sử dụng thực sự của nó trong đoạn trích nhỏ này từ tác phẩm của tôi.

//this is the script that handles the template 
<script id="questionResourceTemplate" type="text/x-jquery-tmpl"> 
    <li class="default-{{:IsDefault}}"> 
     <label data-link="visible{:!IsPageSpecific}" class="surv mleft5"><strong>{{:Type}}</strong></label> 
     <label data-link="visible{:IsPageSpecific}" class="surv mleft5"><input type="text" data-link="Type" /></label> 
     <a data-link="visible{:IsDefault}" href="#" action="deletequestionresource">Delete</a> 
     <br /> 
     {^{for QuestionResourceTexts tmpl="#textTemplate" ~parentQuestionResource=#data ~textboxClass="textbox" /}} 
    </li> 
</script> 

Và đây là nơi mà nó được sử dụng trong HTML

<ul class="question-resource-list"> 
    {^{for QuestionResources tmpl="#questionResourceTemplate" ~parentQuestion=#data /}} 
</ul> 

Vì vậy, trong mỗi sự xuất hiện của đối tượng này, nó ám chỉ rằng mẫu. Chúng tôi cũng có các chức năng trợ giúp ở đây. Bạn có thể sử dụng chúng cho những thứ như trả về một giá trị boolean cho một thử nghiệm, và sau đó hành động trên dữ liệu giống như một thời gian ràng buộc định thời đóng gói. Hy vọng rằng điều này sẽ giúp thêm vào các phản ứng đã được trả lời hoàn hảo trước khi trả lời này.

Answer 3

Từ các tài liệu:

JsRender được sử dụng để render của mẫu để chuỗi, sẵn sàng cho chèn trong DOM.

Nó cũng được sử dụng bởi nền tảng JsViews, bổ sung thêm dữ liệu vào mẫu JsRender và cung cấp nền tảng MVVM chính thức cho dễ dàng tạo các ứng dụng và trang web đơn dữ liệu tương tác.