npm 包 ra-data-prisma2 使用教程

在前端开发中，我们经常需要使用一些后端数据，而前后端分离的开发模式越来越流行。为了提高开发效率，我们需要使用合适的工具来处理数据请求与响应。在这篇文章中，我们将介绍一个非常有用的 npm 包 ra-data-prisma2，它可以帮助我们连接 prisma2 服务端，并快速构建出管理系统前端页面。

安装

使用 npm 安装 ra-data-prisma2：

--- ------- ------ ---------------

配置

在使用 ra-data-prisma2 之前，我们需要先在项目中配置好 prisma2。

1. 安装 prisma2

使用 npm 安装 prisma2：

--- ------- -- -------

2. 初始化 prisma2

使用以下命令初始化 prisma2：

------- ----

3. 创建数据模型

编辑 prisma/schema.prisma，配置数据模型：

---------- -- -
  -------- - ------------
  ---      - -------------------
-

--------- ------ -
  -------- - ------------------
-

----- ---- -
  --        ---      --- -------------------------
  -----     ------
  -------   -------
  --------- -------  ---------------
  --------- -------- ---------------
  --------- -------- ----------
-

4. 生成 prisma-client-js

运行以下命令，生成 prisma-client-js：

------- --------

5. 配置 ra-data-prisma2

在项目中新建文件 src/ra-data-prisma2.js，并配置 ra-data-prisma2：

------ ------------------- ---- -----------------
------ - ------------ - ---- -----------------

----- ------ - --- ---------------

----- ----------- - ----- -- -
  ------ --------------- ---------------
--

----- ----------- - ------ -- -
  ----- --------- - --------------------------------------------------
  ------ -- -------------- -----
--

----- ------------ - -
  -------------
  ----------
  ----------
  -------------
  ------------ - ---
- -- -
  ----- --------- - ------------------
  ----- --------- - --------- ------------- ------ ------------- ------------ ----------
  ----- ----------- - --------------------------
  ----- ------------ - --------- - -------- -------------- - ---
  ----- -------------- - ---
    --------- - ------ ------ - --
  -- ----------- -------------

  ------ -
    ------------ -
      ------ ----------------------- ------------------------ -------------- -
        ---------------------- ------- --------------
      ---
      ---------- -------- ------ ------------ -- --
        ------ -------
        ----- ------
        ----------- ------------
      ---
      -------------- -- ---- -- -- -------------------
    --
    -------------------------- -
      ------ -------------------------- ------------------------------------ -------------- -
        ---------------------------------------- --------------
      ---
      ---------- ------- ------------ -- --
        ----- ------
        ----------- ------------
      ---
      -------------- -- ---- -- -- ------------------------------
    --
    -------------------------- -
      ------ -------------------------- ----------------------------- ------------- ------ ------------- ------------ -------- -------------- -
        ---------------------------- ------- ------------------ --------------
      ---
      ---------- -------- ------ ------------ -- --
        ------ -------
        ----- ------
        ----------- ------------
      ---
      -------------- -- ---- -- -- ------------------------------
    --
    -------------------------- -
      ------ -------------------------- ----------------------------- ------------- ------------ -------- -------------- -
        ---------------------------- ------- ----------- ------------ --------------
      ---
      ---------- -------- ------------ -- --
        ------ -------
        ----------- ------------
      ---
      -------------- -- ---- -- -- ------------------------------
    --
  --
--

------ ------- ----- -------- -------------------
  ----------
  -
    -------
    ------------ - ---
    -------------- - ----- -- ------
  - - ---
- -
  ----- -------------- - ----- --------------------
    ----------
    -
      -------
      ---------------
    --
    ---
  --

  ------ -- -- -
    ----- ------ - -----------------

    ------ -
      ----------
      -------- ----- -------------- ------- -- -
        ----- - ----- ---------- -------- ------------ - - ------------------
        ----- ---- - --------- - --
        ----- ------- - -------------
        ----- - ------ ----- - - ------------

        ----- ------- - --------------------

        ----- -------- - -------------
          -------------
          -----
          -------
          --------------
          -------------
        --
        ----- - ---- - - ----- ----------------
          -----------------------------
          ------------------------------------------------
        --

        ----- ----- - --------------------------

        ----- ------- - ------------------
          ----------- - -------- ---- - ------- - --------
          ------ -- -- ----- --- --------------- ----

        ------ -
          ----- --------
          ------
        --
      --
      ------- ----- -------------- - ---- -- -- -
        ----- -------- - -------------
          -------------
          -----------------------------
          -------
          -----
          -------------
        --
        ----- ----- - - ------- --
        ------ ---------
        ----- - ----- ----------- - - ----- ----------------
          ----------------------------------------
          ---------------------------------------------------
        --

        ------ - ----- - --------------- --- ------------------------- - --
      --
      ------- ----- -------------- - --- ---- -- -- -
        ----- -------- - -------------
          -------------
          -----------------------------
          -------
          -----
          -------------
        --

        ----- - ----- ----------- - - ----- ----------------
          ----------------------------------------
          ---------------------------------------------
            ------ - --- ------------ --- --
            -----
          ---
        --

        ------ - ----- - --------------- --- ------------------------- - --
      --
      ------- ----- -------------- - -- -- -- -
        ----- -------- - -------------
          -------------
          -----
          -------
          -----
          -------------
        --

        ----- - ----- ----------- - - ----- ----------------
          ----------------------------------------
          ---------------------------------------------
            ------ - --- ------------ --- --
          ---
        --

        ------ - ----- - --------------- --- ------------------------- - --
      --
    --
  --
-

使用

到这里，已经完成了 ra-data-prisma2 的配置，我们可以开始使用它来构建我们的管理系统页面了。

例如，我们可以创建一个 Post 的页面：

------ ----- ---- --------
------ -
  -----
  ---------
  ----------
  ------------
  ----------
  -------------
  -----
  -----------
  ----------
  ------------
  ----------
  -------------
  -------
- ---- --------------
------ ------------------ ---- ------------------

----- ------ - ------------------------------

----- --------- - -
  - ----- ------ --
--

----- ---------- - ----- ---------- -- -
  ----- ------------ - -
    ------ ---------------
    -------- -----------------
  --

  ----- ------ - ----- ----------------------------- - ------ -----
  ----- - ---- - - ----- --------------------- - ----- ------------ ---

  ------ - ---- --
--

----- -------- - ----- -- --- -------- -- -- -
  ----- ------------ - -
    ------ ---------------
    -------- -----------------
  --

  ----- ------ - ----- ----------------------------- - ------ -----
  ----- - ---- - - ----- --------------------- - --- ----- ------------ ---

  ------ - ---- --
--

------ ----- ---------- - ------- -- -
  ------- ---------- --------------------
    ------------
      ---------- -------- ----------- --
      ---------- -------------- --
      ---------- ---------------- --
    -------------
  ---------
--

------ ----- -------- - ------- -- -
  ----- ---------- ----------------
    ------------
      ---------- -------- ----------- --
      ---------- -------------- --
      ---------- ---------------- --
      ---------- ------------------ --
      ---------- ------------------ -------- --
    -------------
  -------
--

------ ----- -------- - ------- -- -
  ----- ------------- - ----- -- --
    ----- ----------------------------- - ------ -----

  ------ -
    ----- ---------- ------------ ------- ------ ----- ------ ------ ---
      --------- ----------------
        ------------ ----------- --
        ---------- -------------- --
        ------------- ------------------ --
        ---------- ------------------ --
        ---------- ------------------ --
      -----------
    -------
  --
--

以上代码演示了如何使用 ra-data-prisma2 来实现 CRUD 操作，当然实现的这个页面并不完整，你可以继续优化它。

指导意义

通过本文的学习，我们了解了如何使用 ra-data-prisma2 快速构建出连接 prisma2 服务端的管理系统前端页面。ra-data-prisma2 可以让我们更加快速高效地完成前端页面的开发，提高我们的工作效率，让我们能够更好地实现前后端分离的开发模式。同时，通过对源码的深度分析，我们也能更好地理解如何基于 Apollo Client 来构建出业务组件。这对于我们的前端开发学习和工作都会有重要的指导意义。

来源：JavaScript中文网 ，转载请联系管理员！ 本文地址：https://www.javascriptcn.com/post/60067356890c4f7277583c43

阅读全文

猜你喜欢

  • npm 包 @kaniyarasu/react-editor.js 使用教程

    前言 在前端开发中，我们经常需要使用富文本编辑器，以便让用户可以创建和编辑格式化的文本。其中，@kaniyarasu/react-editor.js 是一个可用性很高的 npm 包，它提供了一个基于 ...

    4 年前
  • npm 包 react-native-gizwits-fs 使用教程

    React Native 是一种流行的移动应用程序框架，用于构建跨平台应用程序。作为前端工程师，在使用 React Native 开发时，我们可能需要处理本地文件系统、文件读写等操作。

    4 年前
  • npm 包 DerekTestingPackagee 使用教程

    什么是 npm 包？ npm（Node Package Manager）是一个资源包管理器，它是 Node.js 的默认包管理器。npm 向开发者提供了便捷的方式来安装和使用开源代码包。

    4 年前
  • npm 包 derektestingpackagee-types 使用教程

    什么是 derektestingpackagee-types？ 在进行 JavaScript 开发时，通常需要使用一些第三方库或者工具包，而这些库或者工具包通常是以 npm 包的形式提供给我们。

    4 年前
  • DerekTestingPackagee-Button：一个前端开发者必备的 npm 包

    DerekTestingPackagee-Button 是一款非常实用的 npm 包，它可以帮助前端开发者快速地创建并使用漂亮、响应式的按钮。本文将详细介绍 DerekTestingPackagee-...

    4 年前
  • npm 包 cbk-utils 使用教程

    介绍 cbk-utils 是一个基于 Node.js 的 JavaScript 工具类库，提供了许多常用的工具函数。它可以帮助你更高效地编写代码，减少代码冗余度和提高代码可维护性。

    4 年前
  • npm 包 node-pushnotifications-http2 使用教程

    什么是 node-pushnotifications-http2? node-pushnotifications-http2 是一个用于推送 HTTP/2 协议消息的标准化 Node.js 库，而 H...

    4 年前
  • npm 包 swag-jv 使用教程

    介绍 swag-jv（swagger-json-validator）是一个能够对 Swagger 的 Json 文件进行校验的 npm 包，它可以帮助我们在编写 Swagger json 文档时，及时...

    4 年前
  • npm 包 ng-drag-to-select 使用教程

    前言 在前端开发中，选择器是一个非常重要的组件。有时候，在页面上需要更加灵活地进行多项选择操作，这时候我们需要一个可拖动的多项选择器。这篇文章将介绍一个非常实用的 npm 包 ng-drag-to-s...

    4 年前
  • npm 包 @trudesk/react-infinite-scroller 使用教程

    本文将介绍如何使用 npm 包 @trudesk/react-infinite-scroller，该包用于实现 React 前端应用程序中的无限滚动效果。 简介 在传统的网页设计中，用户需要点击“下一...

    4 年前
  • NPM 包 React-Native-Hype-Card 使用教程

    React Native 是近年来非常流行的前端框架，可以使用 JavaScript 进行快速的原生app开发。而 React Native Hype Card 是一种可以在 React Native...

    4 年前
  • npm 包 byron-node-rsa 使用教程

    在前端开发过程中，我们常常需要对敏感数据进行加密和解密。这时候，一个好用的加密解密工具就尤为重要。byron-node-rsa 是一个基于 node-rsa 库二次封装的 npm 包，具有易用性和安全...

    4 年前
  • npm 包 bath 使用教程

    在前端开发中，我们经常需要对文件路径进行操作。如果手动操作这些路径，容易出错并且浪费时间。为此，我们可以使用 npm 包 bath，来方便地处理文件路径。 1. 安装 bath 首先，我们需要安装 n...

    4 年前
  • npm 包 pasantes-document-viewer 使用教程

    随着数字化程度的不断提高，越来越多的文档和资料需要在网络上进行共享和浏览。为此，有不少前端开发者开发了各种各样的文档浏览器来满足用户的需求。其中，npm 包 pasantes-document-vie...

    4 年前
  • npm 包 react-pure-props 使用教程

    简介 react-pure-props 是一个 React 组件库，它可以帮助你更好地处理 React 组件的 props，减少代码重复，提高代码的可维护性。 特性 支持对 props 的类型进行限...

    4 年前
  • npm 包 @drama_llama/terminal 使用教程

    简介 @drama_llama/terminal 是一个 Node.js 的 npm 包，用于创建终端窗口和交互。 该包主要用于在 Node.js 环境下创建终端用户接口（TUI），以便于实现终端界面...

    4 年前
  • npm 包 vue-scrollable-container 使用教程

    前言 Web 应用的 UI 主要分为两个部分：展示层和交互层。其中，展示层主要由 HTML、CSS 等技术实现；交互层主要由 JavaScript 技术实现。而 Vue.js 则是一款流行的 MVVM...

    4 年前
  • npm 包 head-http 使用教程

    在前端领域，处理 HTTP 请求是一个必不可少的工作，而 head-http 是一个可以快速获取网页 HTTP 头信息的 npm 包。本文将介绍如何使用 head-http 实现 HTTP 头信息获取...

    4 年前
  • npm 包 milk-cli 使用教程

    在现代的前端开发中，使用 npm 包已经成为不可或缺的一部分。而 milk-cli 这个 npm 包，它能够帮助我们生成项目结构和代码骨架。本文将详细介绍 milk-cli 的使用教程，并提供示例代码...

    4 年前
  • npm 包 sm.simple-uploader 使用教程

    在前端开发中，文件上传是一个常见的需求。而 npm 包 sm.simple-uploader 是一个轻量级的文件上传插件，能够方便地实现文件上传功能。本文将介绍如何使用这个插件进行文件上传，并附带示例...

    4 年前

相关推荐

    暂无文章