评论系统前端


前言：

作者：神的孩子在歌唱
大家好，我叫陈运智，大家可以叫我智

教学视频：
1. 简单介绍
2. 前端界面的搭建
3.一小时带你手写评论功能——python+django+mysql+vue+element+axios
所需环境

  1. 前端：vue+element+axios
  2. 后端：
    python3.8
    django3.1.4
    mysql8.0
  3. 软件
    （1）前端：vs code
    需要插件：在这里插入图片描述

（2）后端：pycharm（我这里用的是官方版）

可以去微信软件管家或者pycharm官网下载

一. 导入vue和element用到的组件

菜鸟教程
在这里插入图片描述

Element文档

在这里插入图片描述
创建这三个文件接下来会用到
在这里插入图片描述

在index.html下输入代码

<!DOCTYPE html>
<html>
<head>
  <meta charset="UTF-8">
  <!-- import Vue before Element -->
  <script src="https://unpkg.com/vue/dist/vue.js"></script>
  <!-- 引入样式 -->
  <link rel="stylesheet" href="https://unpkg.com/element-ui/lib/theme-chalk/index.css">
  <!-- 引入组件库 -->
  <script src="https://unpkg.com/element-ui/lib/index.js"></script>
</head>
<body>
</body>
</html>

二. 使用element设计页面

2.1 导航菜单

  1. 找到想要的图案
    在这里插入图片描述
  2. 放入到body中
  3. 编写vue组件
<!-- 创建vue组件 -->
<script>
    const app=new Vue({
        el:'#app'
    })
</script>

在这里插入图片描述
效果;
在这里插入图片描述

2.2 输入框

在这里插入图片描述

<!-- 输入框 -->
<el-input type="textarea" :rows="5" v-model="input"  placeholder="请输入内容"></el-input>

在这里插入图片描述

2.3 按钮

在这里插入图片描述

<!-- 按钮 -->
<el-button type="primary">点击评论</el-button>

2.4 显示评论

在这里插入图片描述
代码

  <template>
            <el-table  :data="tableData" style="width: 100%">
            
              <el-table-column label="内容" width="1000" prop="content"></el-table-column>
              <el-table-column label="名字" width="200" prop="name"></el-table-column>
              <el-table-column label="日期" width="100" prop="name"></el-table-column>
              
            </el-table>
        </template>

在这里插入图片描述

效果显示

在这里插入图片描述
如果还要修改样式可以查看element的基本配置

在这里插入图片描述

到这里前端基本完成了，接下来我们编写后端代码

完整代码

在这里插入图片描述

本人博客：https://blog.csdn.net/weixin_46654114
转载说明：跟我说明，务必注明来源，附带本人博客连接。

请给我点个赞鼓励我吧
在这里插入图片描述

# python
Logo
一门面向 Data 和 AI 的低代码、云原生的开源编程语言

无需安装部署，在线快速体验 Byzer

更多推荐

编译时权限控制

前言 权限控制，对于 MLSQL 而言的重要程度可以说是生命线。 MLSQL 需要面对各式各样的资源访问，比如 MySQL, Oracle,HDFS，Hive，Kafka，Sorl，ElasticSearch，Redis，API，Web等等，不同用户对这些数据源（以及表，列）的权限是不一样的。 传统模式是，每个用户都需要有个 proxy user，然后到每个数据源里面给这个 proxy user

avatar Byzer 白泽

Byzer 支持 JDBC 聚合下推

聚合下推PR链接聚合下推 我们知道 Byzer 支持多数据源和联邦查询，可以方便分析师在一个平台上快速的分析来自多种数据源的数据，从而进行灵活的探索式分析。 使用场景和优势 当前 Byzer 中加载数据的方式会拉取明细数据到 spark 中进行聚合计算，对于小数据量或者在分布式文件系统上的数据源来说是常规操作。但是对于 JDBC 数据源或者有分析能力的 OLAP 系统来说拉取明细数据可能就不是最

avatar Byzer 白泽

Byzer 术语表

Byzer-lang Byzer ，又称为 Byzer-lang，一门面向 Data 和 AI 的低代码、云原生的开源编程语言。 Byzer 是一门结合了声明式编程和命令式编程的混合编程语言，其低代码且类 SQL 的编程逻辑配合内置算法及插件的加持，能帮助数据工作者们高效打通数据链路，完成数据的清洗转换，并快速地进行机器学习相关的训练及预测。 Byzer 希望能够提供一套语言、一个引擎，就能覆盖整

avatar Byzer 白泽