简体   繁体   English

将page.js与sinatra(或rails)一起使用

[英]using page.js with sinatra (or rails)

I would like to know if it's possible to use page.js with sinatra. 我想知道是否可以将sinatrapage.js一起使用。 My images 's route are intercepted by Sinatra instead of Page.js 我的images路线被Sinatra而不是Page.js拦截

get '/' do
  erb :index
end

__END__

@@ layout
 <!DOCTYPE html>
 <html lang="en">
 <head>
   <title>page.js</title>
   <link href="//maxcdn.bootstrapcdn.com/bootstrap/3.3.1/css/bootstrap.min.css" rel="stylesheet">
   <script type="text/javascript" src="page.js"></script>
   <style type="text/css">ul li { display: inline; list-style:none }</style>
 </head>
 <body>
   <%= yield %>
</body>
<script type="text/javascript">
page('/images', function(ctx){
      console.log('page(' + ctx.path + ')');
          $('section#example').html('<h2 class="text-center">Listing of Images</h2>');
});
/*... /videos ..*/
page('*', function(ctx){
      console.log('page(' + ctx.path + ')');
          $('section#example').html('<h2 class="text-center">Error : ' + ctx.path + '</h2>');
});

$('document').ready(function(){page()});

</script>
</html>

@@ index
    <ul>
      <li><a href="./">index</a></li>
      <li><a href="./videos">videos</a></li>
      <li><a href="./images">images</a></li>
    </ul>
   <section id="example" class="well"></section>
   <h1>hello world</h1>

I think the problem is just the location of your local page.js file. 我认为问题只是本地page.js文件的位置。 Sinatra expects to find the static assets in a directory called public (otherwise the path is assumed to be a defined route). Sinatra希望在名为public的目录中找到静态资产(否则,假定该路径为已定义的路由)。 So just create the directory and move your page.js file in there (but keep the script src as is). 因此,只需创建目录并将您的page.js文件移到该目录中即可(但请保持脚本src不变)。 If you want to change the directory Sinatra serves static assets from, you can do it like this: 如果要更改Sinatra提供静态资产的目录,则可以这样操作:

set :public_folder, Proc.new { File.join(root, "my_directory_with_assets") }

I think you're also missing jQuery so add it from their CDN. 我认为您也缺少jQuery因此请从其CDN中添加它。

<script src="//code.jquery.com/jquery-1.11.2.min.js"></script>

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM