Think php6.0官网网址：序言 · ThinkPHP6.0完全开发手册 · 看云 (kancloud.cn)

下面是基础配置

第一步：创建TP框架，命名为tp

composer create-project topthink/think tp

第二步：点击架构里面的多应用模式，安装多应用模式拓展

composer require topthink/think-multi-app

第三步：点击视图里面的模板引擎，安装视图拓展

composer require topthink/think-view

第四步：点击tp框架里面的 .example.env 文件，将该文件重命名为 .env

第五步：创建一个名字为demo的多应用目录，该目录保存在app下

php think build demo

第六步：创建一个名为Goods的控制器

php think make:controller demo@Goods --plain

第七步：创建一个名为Good的模型

php think make:model demo@Good

第八步：在demo目录下面创建路由名为route的目录，并在该目录里面创建route.php路由文件，并借鉴框架里面的route目录下面的app.php路由文件，将下面路径复制到新建的route.php路由文件里面

use think\facade\Route;

下面配置域名数据库

在小皮里面配置第一域名www.2006a.com，并且根目录选择tp框架里面的public目录里面

此时已经可以访问到该框架

打开Nacivat，创建2006a数据库，并创建text表

在demo目录下面的view创建一个form.html，在网页访问的时候后因为域名需要为www.2006a.com/index.php/demo/form  才可以访问，这时需要打开public目录下面的 .htaccess文件，并将最后一行修改为

RewriteRule ^(.*)$ index.php?/$1 [QSA,PT,L]

因为该表单需要富文本，所以要把下面该富文本文件复制到public目录下面

（因文件无法上传，所以放网盘里面了）

链接：https://pan.baidu.com/s/1fsvhldLlJz3rRjPv0kfOMw?pwd=0613

提取码：0613

基本配置已经完成

连接到数据库，找到tp框架下面的.env文件进行修改为以下

APP_DEBUG = true

[APP]

DEFAULT_TIMEZONE = Asia/Shanghai

[DATABASE]

TYPE = mysql

HOSTNAME = 127.0.0.1

DATABASE = 2006a

USERNAME = root

PASSWORD = root

HOSTPORT = 3306

CHARSET = utf8

DEBUG = true

[LANG]

default_lang = zh-cn

点击demo目录下面的模型文件,连接2006a数据库里面的text表单

<?php

declare (strict_types = 1);

namespace app\demo\model;

use think\Model;

/**

 * @mixin \think\Model

 */

class Good extends Model

{

    //连接表单

    public $table='text';

}

下面是富文本到form表单上面

首先找到public目录下的utf8-php，打开该文件夹再点开index.html文件，里面有下面三行代码

 <script type="text/javascript" charset="utf-8" src="ueditor.config.js"></script>

    <script type="text/javascript" charset="utf-8" src="ueditor.all.min.js"> </script>

    <!--建议手动加在语言，避免在ie下有时因为加载语言失败导致编辑器加载失败-->

    <!--这里加载的语言文件会覆盖你在配置项目里添加的语言类型，比如你在配置项目里配置的是英文，这里加载的中文，那最后就是中文-->

    <script type="text/javascript" charset="utf-8" src="lang/zh-cn/zh-cn.js"></script>

选中这三行，要注意的是需要更改路径，将这三行代码复制到已经创建好的dmeo目录下的form表单，路径更改为

<script type="text/javascript" charset="utf-8" src="/utf8-php/ueditor.config.js"></script>

    <script type="text/javascript" charset="utf-8" src="/utf8-php/ueditor.all.min.js"> </script>

    <!--建议手动加在语言，避免在ie下有时因为加载语言失败导致编辑器加载失败-->

    <!--这里加载的语言文件会覆盖你在配置项目里添加的语言类型，比如你在配置项目里配置的是英文，这里加载的中文，那最后就是中文-->

    <script type="text/javascript" charset="utf-8" src="/utf8-php/lang/zh-cn/zh-cn.js"></script>

接着回到index.html文件，在61行，有

<script type="text/javascript">

                //实例化编辑器

    //建议使用工厂方法getEditor创建和引用编辑器实例，如果在某个闭包下引用该编辑器，直接调用UE.getEditor('editor')就能拿到相关的实例

    var ue = UE.getEditor('editor');

这个也直接复制到form表单里面，不过需要注意的是，后面要加一个</script>，另外editor是富文本框的id值，注意更改

然后我们大致的表单添加页面就是

<!DOCTYPE html>

<html lang="en">

<head>

    <meta charset="UTF-8">

    <title>Title</title>

    <!-- 最新版本的 Bootstrap 核心 CSS 文件 -->

    <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/3.4.1/css/bootstrap.min.css" integrity="sha384-HSMxcRTRxnN+Bdg0JdbxYKrThecOKuH5zCYotlSAcp1+c8xmyTe9GYg1l9a69psu" crossorigin="anonymous">

    <meta http-equiv="Content-Type" content="text/html;charset=utf-8"/>

    <script type="text/javascript" charset="utf-8" src="/utf8-php/ueditor.config.js"></script>

    <script type="text/javascript" charset="utf-8" src="/utf8-php/ueditor.all.min.js"> </script>

    <!--建议手动加在语言，避免在ie下有时因为加载语言失败导致编辑器加载失败-->

    <!--这里加载的语言文件会覆盖你在配置项目里添加的语言类型，比如你在配置项目里配置的是英文，这里加载的中文，那最后就是中文-->

    <script type="text/javascript" charset="utf-8" src="/utf8-php/lang/zh-cn/zh-cn.js"></script>

<body>

<div style="width: 800px; margin: auto;padding-top: 200px;">

    <form class="form-horizontal" method="post" enctype="multipart/form-data" action="/demo/add">

        <div class="form-group">

            <label  class="col-sm-2 control-label">用户名：</label>

            <div class="col-sm-10">

                <input type="text" class="form-control" name="username" placeholder="请输入用户名">

            </div>

        </div>

        <div class="form-group">

            <label  class="col-sm-2 control-label">性别：</label>

            <div >

                <input type="radio" name="userend" value="男">男

                <br>

                <input type="radio" name="userend" value="女">女

            </div>

        </div>

        <div class="form-group">

            <label  class="col-sm-2 control-label">个人头像：</label>

            <div class="col-sm-10">

                <input type="file" class="form-control" name="userimg">

            </div>

        </div>

        <div class="form-group">

            <label  class="col-sm-2 control-label">时间：</label>

            <div class="col-sm-10">

                <input type="datetime-local" name="usertime" class="form-control">

            </div>

        </div>

        <div class="form-group">

            <label  class="col-sm-2 control-label">个人介绍：</label>

            <div class="col-sm-10">

                <textarea name="usertext" id="goods_introduce" cols="90" rows="3" placeholder="我喜欢读书、跑步"></textarea>

            </div>

        </div>

        <div class="form-group">

            <div class="col-sm-offset-2 col-sm-10">

                <button type="submit" class="btn btn-primary btn-lg">注册</button>

            </div>

        </div>

    </form>

</div>

</body>

</html>

<script type="text/javascript">

    //实例化编辑器

    //建议使用工厂方法getEditor创建和引用编辑器实例，如果在某个闭包下引用该编辑器，直接调用UE.getEditor('editor')就能拿到相关的实例

    var ue = UE.getEditor('goods_introduce');

</script>

下面是路由

<?php

use think\facade\Route;

Route::get('form',function (){

    return view('form');

});

Route::post('add','Goods/add');

Route::get('list','Goods/list');

Route::get('delete','Goods/del');

这个是控制器

<?php

declare (strict_types = 1);

namespace app\demo\controller;

use app\Request;

use think\facade\Filesystem;

use think\facade\View;

class Goods

{

    //添加

    public function add(Request $request){

        $pram=$request->param();

        $data= new \app\demo\model\Good();

        $file=$request->file('userimg');

        $save='/'.Filesystem::disk('public')->putFile('image',$file);

        $pram['userimg']=$save;

        $res=$data->insert($pram);

        if ($res){

            return "<script>alert('添加成功');location.href='list'</script>";

        }

    }

    //展示

    public function list(){

//        $data=new \app\demo\model\Good();

//        $res=$data->paginate(3);

        $data=\app\demo\model\Good::order('id','desc')->paginate(3);

        return View::fetch('/list',['data'=>$data]);

    }

    //删除

    public function del(Request $request){

        $id=$request->param('id');

        $data= new \app\demo\model\Good();

        $del=$data->where('id',$id)->delete();

        if ($del){

            return "<script>alert('删除成功');location.href='list'</script>";

        }else{

            return "<script>alert('删除失败');location.href='list'</script>";

        }

    }

}

最基础的添加展示和删除就完成了

Think PHP 完整的带富文本格式以及图片上传，并且在页面上分页展示的更多相关文章

  1. 用POP动画编写带富文本的自定义动画效果

    用POP动画编写带富文本的自定义动画效果 [源码] https://github.com/YouXianMing/UI-Component-Collection [效果] [特点] * 支持富文本 * ...

  2. SpringMvc + Jsp+ 富文本 kindeditor 进行 图片ftp上传nginx服务器 实现

    一:html 原生态的附件上传 二:实现逻辑分析: 1.1.1 需求分析 Common.js 1.绑定事件 2.初始化参数 3.上传图片的url: /pic/upload 4.上图片参数名称: upl ...

  3. 在Asp.Net Core中配置使用MarkDown富文本编辑器实现图片上传和截图上传（开源代码.net core3.0）

    我们的富文本编辑器不能没有图片上传尤其是截图上传,下面我来教大家怎么实现MarkDown富文本编辑器截图上传和图片上传. 1.配置编辑器到html页 <div id="test-edi ...

  4. 百度富文本Ueditor将图片存在项目外路径并回显

    我的毕设中需要一个类似新闻发布的功能,使用到百度富文本编辑器,不过百度富文本编辑器有点坑(只是我太菜了),粘贴图片和回显这个坑坑了我两天时间.效果是这样的: 就是可以在文本中粘贴图片并显示出来,直接说 ...

  5. 富文本vue-quill-editor修改图片上传方法

    富文本vue-quill-editor修改图片上传方法 HTML 代码 HTML codes <!-- 上传的组件 --> <upload style="display:n ...

  6. Vue富文本编辑器（图片拖拽缩放）

    富文本编辑器(图片拖拽缩放) 需求: 根据业务要求,需要能够上传图片,且上传的图片能在移动端中占满屏幕宽度,故需要能等比缩放上传的图片,还需要能拖拽.缩放.改变图片大小.尝试多个第三方富文本编辑器,很 ...

  7. jenkins+svn完整打包并上传到linux服务器上

    因为公司用的是svn版本管理工具并且部署在了windows服务器上,所以测试环使用jenkins需要部署两套环境, 一套是在本地windows服务器,jenkins从svn下载代码完成打包并上传到li ...

  8. vue-quill-editor + iview 实现富文本编辑器及图片上传

    1.npm 安装 vue-quill-editor npm install vue-quill-editor 2.再main.js中引入 import VueQuillEditor from 'vue ...

  9. 关于移动手机端富文本编辑器qeditor图片上传改造

    日前项目需要在移动端增加富文本编辑,上网找了下,大多数都是针对pc版的,不太兼容手机,当然由于手机屏幕小等原因也限制富文本编辑器的众多强大功能,所以要找的编辑器功能必须是精简的. 找了好久,发现qed ...

随机推荐

  1. Git出现“filename too long”错误处理

    更新记录 本文迁移自Panda666原博客,原发布时间:2021年5月8日. 怎么肥事? Windows系统下,在Git使用过程中,出现"filename too long"错误提 ...

  2. 【Redis】事件驱动框架源码分析

    aeEventLoop初始化 在server.c文件的initServer函数中,对aeEventLoop进行了初始化: 调用aeCreateEventLoop函数创建aeEventLoop结构体,对 ...

  3. 【Java集合】ArrayDeque源码解读

    简介 双端队列是一种特殊的队列,它的两端都可以进出元素,故而得名双端队列. ArrayDeque是一种以循环数组方式实现的双端队列,它是非线程安全的. 它既可以作为队列也可以作为栈. 继承体系 Arr ...

  4. 【Pr】基础流程

    新建工程 1.打开Pr 2.点击"新建""项目" 3.在电脑磁盘上新建好项目想要存放的位置,比如Demo1,为了便于管理,我先新建了一个Demo文件夹,再在里边 ...

  5. Spring Data JPA系列2：SpringBoot集成JPA详细教程，快速在项目中熟练使用JPA

    大家好,又见面了. 这是Spring Data JPA系列的第2篇,在上一篇<Spring Data JPA系列1:JDBC.ORM.JPA.Spring Data JPA,傻傻分不清楚?给你个 ...

  6. CAP：多重注意力机制，有趣的细粒度分类方案 | AAAI 2021

    论文提出细粒度分类解决方案CAP,通过上下文感知的注意力机制来帮助模型发现细微的特征变化.除了像素级别的注意力机制,还有区域级别的注意力机制以及局部特征编码方法,与以往的视觉方案很不同,值得一看 来源 ...

  7. JQuery中html()，val()，text()-的区别

    1.HTML html():取得第一个匹配元素的html内容.这个函数不能用于XML文档.但可以用于XHTML文档 html(val):设置每一个匹配元素的html内容.这个函数不能用于XML文档.但 ...

  8. pytest多进程/多线程执行测试用例

    前言: 实际项目中的用例数量会非常多,几百上千:如果采用单进程串行执行的话会非常耗费时间.假设每条用例耗时2s,1000条就需要2000s $\approx$ 33min:还要加上用例加载.测试前/后 ...

  9. CF1042E Vasya and Magic Matrix 题解

    题目链接 思路分析 看到题目中 \(n,m \leq 1000\) ,故直接考虑 \(O(n^2)\) 级别做法. 我们先把所有的点按照 \(val\) 值从小到大排序,这样的话二维问题变成序列问题. ...

  10. 螣龙安科：威胁研究——与MAZE勒索软件事件相关的策略，技术和程序

    至少从2019年5月开始,恶意行为者就一直在积极部署MAZE勒索软件.勒索软件最初是通过垃圾邮件和漏洞利用工具包分发的,后来又转移到妥协后进行部署.根据我们在地下论坛中对涉嫌用户的观察以及整个Mand ...