正文

json简单的下一部电影应用(代码片段)

author  author  2023-01-18  193

关键词：

import Layout from '../components/MyLayout.js'
import Link from 'next/link'
import fetch from 'isomorphic-unfetch'

const Index = (props) => (
  <Layout>
    <h1>Batman TV Shows</h1>
    <ul>
      props.shows.map((show) => (
        <li key=show.id>
          <Link as=`/p/$show.id` href=`/post?id=$show.id`>
            <a>show.name</a>
          </Link>
        </li>
      ))
    </ul>
    <style jsx>`
      ul 
        padding: 0;
      
      li 
        list-style: none;
        margin: 5px 0;
      
      a 
        text-decoration: none;
        color: blue;
      
      a:hover 
        opacity: 0.6;
      
    `</style>
  </Layout>
)

Index.getInitialProps = async function() 
  const res = await fetch('https://api.tvmaze.com/search/shows?q=batman')
  const data = await res.json()

  console.log(`Show data fetched. Count: $data.length`)

  return 
    shows: data
  


export default Index

import Layout from '../components/MyLayout.js'
import fetch from 'isomorphic-unfetch'

const Post = (props) => (
    <Layout>
       <h1>props.show.name</h1>
       <p>props.show.summary.replace(/<[/]?p>/g, '')</p>
       <img src=props.show.image.medium/>
    </Layout>
)

Post.getInitialProps = async function (context) 
  const  id  = context.query
  const res = await fetch(`https://api.tvmaze.com/shows/$id`)
  const show = await res.json()

  console.log(`Fetched show: $show.name`)

  return  show 


export default Post

import Header from './Header'

const layoutStyle = 
  margin: 20,
  padding: 20,
  border: '1px solid #ddd'


const Layout = props => (
  <div style=layoutStyle>
    <Header />
    props.children
  </div>
)

export default Layout

const express = require('express')
const next = require('next')

const dev = process.env.NODE_ENV !== 'production'
const app = next( dev )
const handle = app.getRequestHandler()

app.prepare()
.then(() => 
  const server = express()

  server.get('/p/:id', (req, res) => 
    const actualPage = '/post'
    const queryParams =  id: req.params.id 
    app.render(req, res, actualPage, queryParams)
  )

  server.get('*', (req, res) => 
    return handle(req, res)
  )

  server.listen(3000, (err) => 
    if (err) throw err
    console.log('> Ready on http://localhost:3000')
  )
)
.catch((ex) => 
  console.error(ex.stack)
  process.exit(1)
)


  "name": "hello-next",
  "version": "1.0.0",
  "description": "",
  "main": "index.js",
  "scripts": 
    "dev": "node server.js",
    "build": "next build",
    "start": "NODE_ENV=production node server.js",
    "build": "next build"
  ,
  "keywords": [],
  "author": "Juan Pablo Casabianca <hola@jpcasabianca.com> (http://jpcasabianca.com)",
  "license": "ISC",
  "dependencies": 
    "express": "^4.16.4",
    "isomorphic-unfetch": "^3.0.0",
    "next": "^7.0.2",
    "react": "^16.6.3",
    "react-dom": "^16.6.3"

算法问题寻找全排列的下一个数(代码片段)

寻找全排列的下一个数摘自漫画算法：题目：给出一个正整数，找出这个正整数所有数字全排列的下一个树。说的通俗点就是在一个整数所包含数字的全部组合中，找到一个大于且仅大于原数的新整数。例子：如果输入12345，则... 查看详情

算法问题寻找全排列的下一个数(代码片段)

查找此异常原因的下一步是啥？

】查找此异常原因的下一步是啥？【英文标题】：Whataremynextstepsonfindingthecauseofthisexception?查找此异常原因的下一步是什么？【发布时间】：2015-08-3108:18:54【问题描述】：我对Eclipse、Java和Android编程相当陌生。我已经接管了一个And... 查看详情

css单击箭头以滚动到横幅的下一部分。(代码片段)

查看详情

css单击箭头以滚动到横幅的下一部分。(代码片段)

查看详情

剑指offer：二叉树的下一节点(代码片段)

...给定一个二叉树和其中的一个结点，请找出中序遍历顺序的下一个结点并且返回。注意，树中的结点不仅包含左右子结点，同时包含指向父结点的指针。解题思路一、暴力解决分析Node可能在二叉树的所有位置，逐个进行分析。... 查看详情

如何知道我的下一次调用printf()是否会超过屏幕大小？(代码片段)

...在用C语言编写一个程序，我的问题很直接：如何知道我的下一次调用是否是在printf()会不会超过屏幕大小？也就是说，有时使用print时，文字可能无法在一个屏幕上显示。例如，我有4-5个字符串要打印，我想创建一个函数，打印... 查看详情

低复杂度-服务网格的下一站(代码片段)

作者|AddoZhang来源|云原生指北译者：作为一个曾经在新造车公司的基础架构团队任职，为支持公司的“互联网基因”和“数字化转型”落地了云原生基础设施平台，并在尝试采用服务网格未成的我来说，看到这篇... 查看详情

flutter的下一步，dart3重大变更即将在2023到来(代码片段)

在过去的四年里Dart已经发展成为一门高效、可移植的现代化语言，而下一个版本Dart3将达到可靠的null安全语言的最后一步。作为nullsafety的最后一步，本次将删除几个历史Dart和SDKartifacts，包括删除对runningwithoutsoundnulls... 查看详情

Coffeescript 等到从回调中设置标志，然后继续代码的下一部分

...1-11-1219:05:05【问题描述】：我这里有一个使用coffeescript的简单程序，它在Raspberrypi上创建一个服务器，它从在同一网络上的Windows机器上运查看详情

如何默认选择第一项，然后在角度 6 中突出显示选定的下一项 json 数据

】如何默认选择第一项，然后在角度6中突出显示选定的下一项json数据【英文标题】：howtoselectfirstitembydefaultandthenhighlighttheselectednextitemofjsondatainangular6【发布时间】：2019-01-1715:08:21【问题描述】：这是我的customer.component.html。我... 查看详情

跳到循环 vba 中的下一次迭代

...间】：2014-01-0723:57:48【问题描述】：我正在尝试创建一个简单的条件循环，如果条件为真，它将进入下一次迭代。我到目前为止的代码是：Fori=2To24Level=Cells(i,4)Return=Cells(i,5)IfReturn=0AndLevel=0Then\'GotothenextiterationEl 查看详情

二叉树的下一个节点(代码片段)

...给定一个二叉树和其中的一个结点，请找出中序遍历顺序的下一个结点并且返回。注意，树中的结点不仅包含左右子结点，同时包含指向父结点的指针。思路首先知道中序遍历的规则是：左根右，然后作图 1.若当前节点有右... 查看详情

双向循环链表实现(代码片段)

...，让head结点指向新结点，更新tail结点，让tail的下一跳重新指向head。尾部插入将当前tail的下一跳给新节点的下一跳让tail的下一跳指向新结点，新结点的上一跳指向tail。tail重新指向新结点。直接让head的上一跳重... 查看详情

双向循环链表实现(代码片段)

获取循环中的下一项

...【发布时间】：2011-12-2218:19:14【问题描述】：我想做的很简单：我有一个模型，我正在运行一个重组循环。现在我想将循环的前4项并排显示，然后在下一行继续显示接下来的4项，直到列表完成。如果没有更多项目，则该行中的... 查看详情

如何在角度的行的下一列中打开routerlink？(代码片段)

...想点击任何侧边栏菜单的routerLink。我的目标是打开该行的下一列中的链接，通常发生在仪表板/管理面板中。但在我的情况下，当我点击链接时，它会转到下一页。<divclass="row"><divclass="col-sm-2"><divclass="list-group"><aro... 查看详情

r代码段显示了自定义的html表函数和示例。我的下一步是将此html表复制并粘贴到excel文件中，(代码片段)

查看详情