[Práctica del mini programa] Imite las noticias de Sina y simule datos falsos con mockjs para lograr un gran trabajo

01 Prefacio

El último semestre es el primer semestre del tercer año.

Al final de la gran tarea, imité a Sina News para simular esta tarea falsa con mockjs

La barra de navegación inferior tiene lo siguiente:
Inserte la descripción de la imagen aquí
Una introducción aproximada a cada página:
Inserte la descripción de la imagen aquí

02 Home-News-Rendering

Inserte la descripción de la imagen aquí
Haga clic aquí para ver la página de detalles. Tire
Inserte la descripción de la imagen aquí
hacia abajo para hacer clic en la función compartir
Inserte la descripción de la imagen aquí

03 Representaciones de páginas de comentarios

Inserte la descripción de la imagen aquí
Haga clic aquí para ver la página de detalles.
Inserte la descripción de la imagen aquí
Del mismo modo, tire hacia abajo para hacer clic para compartir
Inserte la descripción de la imagen aquí

04 Clasificación de representaciones de página

Inserte la descripción de la imagen aquí
Haga clic para ingresar a la página de detalles
Inserte la descripción de la imagen aquí
Inserte la descripción de la imagen aquí

05 El proceso clave de realización

Cree una nueva carpeta: api
escribe el método de encapsulación en ella e introduce el
Inserte la descripción de la imagen aquí
código fuente en la página que debe usarse .

const events = require('../mocks/events.js')

//获取评论列表
//这里的函数里面取的就是mocks的数据
const getEventsList = () => {
  // const detail=news.find(e=>e.id===id);
  return events;
}
//获取评论详情
const getEventsDetail = (id) => {
  const detail = events.find(e => e.id == id);
  return detail;
}
module.exports = {
  getEventsList,
  getEventsDetail
}

Cree una nueva carpeta: los simulacros
escriben datos falsos en ella, llámela en wsml para
obtener datos dinámicamente
, importe datos en la página de forma circular y muestre datos en la página de detalles respectivamente
Inserte la descripción de la imagen aquí
Inserte la descripción de la imagen aquí
Mis herramientas
Inserte la descripción de la imagen aquí
Inserte la descripción de la imagen aquí

06 Estructura del directorio

Inserte la descripción de la imagen aquí
Inserte la descripción de la imagen aquí

252 artículos originales publicados · Me gusta 106 · Visitas 30,000+

Supongo que te gusta

Origin blog.csdn.net/weixin_42554191/article/details/105524244
Recomendado
Clasificación