云起开发平台 1.1 版本发布,支持后端渲染 Vue 页面

谁告诉你的,使用Vue就一定要前后端分离,云起开发平台1.1版本通过重写thinkphp-template模板引擎,使它能支持在后端渲染vue页面,从此不用打包,不用繁琐的代理处理跨域,不用vue-router,不用前后端都要重复控制权限问题,不用npm引入一大堆看不懂的js代码,你就能愉快的使用vue来编程。

如下所示,这是一段回收站功能的代码,不用打包,不用nodejs,不用ssr,所见即所得,响应快捷迅速。

<template>
    <el-card shadow="never" style="border:0;">
        <yun-table
                :columns='recyclebin_("init")'
                search="{$search}"
                ref="yuntable"
                :common-search="false"
                :extend="extend"
                toolbar="refresh,restore,destroy,restoreall,clear">
            <template #toolbar="{tool,selections}">
                <el-button v-if="tool=='restore'" type="success" @click.stop="recyclebin_('restore',selections)" :disabled="selections.length == 0"><i class="fa fa-rotate-left"></i>&nbsp;还原</el-button>
                <el-button v-if="tool=='destroy'" type="danger" @click.stop="recyclebin_('destroy',selections)" :disabled="selections.length == 0"><i class="fa fa-remove"></i>&nbsp;彻底删除</el-button>
                <el-button v-if="tool=='restoreall'" type="warning" @click.stop="recyclebin_('restoreall')"><i class="fa fa-rotate-left"></i>&nbsp;全部还原</el-button>
                <el-button v-if="tool=='clear'" type="danger" @click.stop="recyclebin_('clear')"><i class="fa fa-remove"></i>&nbsp;全部清空</el-button>
            </template>
        </yun-table>
    </el-card>
</template>
<script>
    import table from "@components/Table.js";
    export default{
        components:{
            'YunTable':table
        },
        data:{
            extend:{
                index_url:Yunqi.config.url,
                recyclebin_url:'',
            }
        },
        onLoad:function (){
            this.extend.recyclebin_url = Yunqi.config.url.slice(0,Yunqi.config.url.indexOf('?'));
        },
        methods: {

        }
    }
</script>
<style>

</style>

云起开发平台是基于 Thinkphp8.0 + ES6.0 + Vue3.2 + Element Plus2.3 等技术开发的,开源免费的快速开发平台。

猜你喜欢

转载自www.oschina.net/news/262609/yunqi-development-platform-1-1-released