zoukankan      html  css  js  c++  java
  • Backbone.Router

    Backbone.Router    

    场景:程序要为应用的重要位置提供可链接,可收藏,可分享的URLs.hash片段可以用来提供这种链接,History API ,可以用来处理标准URLs  (/page)

    Backbone.Router   为客户端路由提供了方法,并能连接到指定的动作或事件。对于不支持History API的旧浏览器,路由提供了优雅的回调函数并可以透明的进行URL片段的转换

    页面加载期间,当应用于创建了所有的路由,需要调用   Backbone.history.start()   

    Backbone.history.start({pubState:true})  来确保初始化URL的路由

    var Workspace = Backbone.Router.extend({

      routes:{

        "help" :  "help",

        "search/:query": "search",

        "search/:query/p:page":"search"

      },

      help:function(){


      },

      search:function(query,page) {

        

      }

    });  


    当访问者点击浏览器后退按钮,或者输入URL,如果匹配一个路由,会触发一个基于动作

    openPage:function(pageNumber) {

      this.document.pages.at(pageNumber).open();

      this.navigate("page/" + pageNumber);

    navigate    router.navigate(fragment,[triggerRouter])

    手动到达应用程序的某个位置,传入triggerRouter以执行路由动作函数


    Backbone.history

    History 作为全局路由服务用于处理hasChange 事件或pushState,匹配适合的路由,并触发回调函数     Backbone.history会自动创建

    Backbone 会自动判断浏览器对pushState的支持,以供选择。不支持的浏览器将会继续使用基于猫点的URL片断,如果兼容pushState的浏览器访问了某个 URL猫点,将会透明的转换为真实的URL

    start    Backbone.history.start()

    当所有的路由创建并设置完毕,调用 Backbone.history.start()  开始监控haschange 事件并分配路由

    让它支持pushState        Backbone.history.start({pushState:true});

    给出基于的路径     Backbone.history.start({pushState: true, root: "/public/search/"})

    如果服务器已渲染了整个页面,但又不希望开始History时触发初始路由,传入silent:true


    Backbone.sync

    Backbone每次向服务器读取或保存模型时都要调用执行的函数。

    它使用   $.ajax   方法发送  RESTful json    可以重载该方法


    Backbone.sync语法      sync(method,model,[option])

    method  CRUD方法    create   read update  delete

    model 要被保存的模型

    option 成功或失败后的回调函数    以及所有jquery请求支持的类型


    Backbone.sync 发送请求以保存模型时,其属性会被序列化为JSON ,头为application/json   

    当接收来自服务器的JSON响应后,对经过服务器改变的模型进行拆解,然后在客户端更新,当read 请求从服务器端,响应一个集合时,便拆解模型属性对象 的数组 

     create POST  /collection

    read .GET /collection[/id]

    update  PUT /collection/id

    delete   DELETE collection/id


    emulateHTTP   Backbone.emulateHTTP = true

    用于老浏览器不支持 PUT DELETE 请求时


    Backbone.emulateJSON = true 

    不支持application/json请求,





  • 相关阅读:
    牛人读书 列表
    设计模式 简介
    java 并发编程 list
    Spring Boot 概念知识
    JS原生Date类型方法的一些冷知识
    JavaScript 操作 Cookie
    nodeJS(express4.x)+vue(vue-cli)构建前后端分离详细教程(带跨域)
    Vue学习笔记(一)
    windows下常查看端口占用方法总结
    webstorm添加*.vue文件代码提醒支持webstorm支持es6vue里支持es6写法
  • 原文地址:https://www.cnblogs.com/yushunwu/p/2296115.html
Copyright © 2011-2022 走看看