art-template 做官网

2024-09-05

art-template引擎模板

art-template简介 artTemplate(后文简称aT)才是模板引擎,而TmodJS(后文简称TJ,曾用名atc)则是依赖于前者的一款模板预编译器.两者都是由腾讯开发.其实aT完全可以独立使用,而TJ存在的意义是提供了一个对模板进行预编译的环境(基于NodeJS和模块化).有了TJ,aT可以支持按目录的方式存储模板.以include的方式对指定目录中的模板进行调用(注意:这里的include和aT中的include不一样,后者只能引用同一页面中的不同模板标签).自动监控模板变化与自动

art template前端模板引擎

偶然看到后台有一段代码采用的是art template的模板引擎地址为 http://aui.github.io/artTemplate/ 这段代码很简洁 var html = template('detail', {data: data.data, shstatus: status}); artDialog({ content: '<div id="vorder_detail">' + html + '</div>', lock: true, fixed:

art.template 循环里面分组。

后台提供给我们一个数组,我们要用模版实现上面的格式输出怎么版呢? 下面就是解决方案: <h2>循环4个一组</h2> <script type="text/html" id="temp1"> <b> {{each rows as item i}} {{if i%4==0}}<b>[{{/if}} {{item.userName}} {{if i>0 && (i-3)%4==0}}]&l

利用art.template模仿VUE 一次渲染多个模版

TypeScript代码 import template = require('art-template/lib/template-web'); interface TemplateBindConfig { el: string data: object } interface TemplateList { els: object template: string } class TmpBind { el: string template: any data: object renderFn:

利用art.template模仿VUE

首先先看一下Typescript代码: import template = require('art-template/lib/template-web'); interface TemplateBindConfig { el: string data: object } class TmpBind { el: string template: any data: object renderFn: any // 构造函数 constructor(config:TemplateBindConfig

js 模板引擎 -Art Template

一个例子涵盖所有: <!doctype html> <html> <head> <meta charset="UTF-8"> <title>include demo</title> <script src="template.js"></script> </head> <body> <div id="content">

开源项目 PM 浅谈如何设计官网

有用户反馈进入官网首页光秃秃的一片,大家忙着做产品,忽略了官网的建设,惭愧惭愧. 确实,极简风格和极其简单还是有很大区别的. 旧的 Web 端除了极其简单之外,它还有一个小问题,首页没有适配移动端. 旧的移动端接下来我会从下面这三点分享如何设计我们的新官网: 展示内容页面布局适配移动端-响应式布局展示内容我设计时会从两个角度考虑: 网友希望在官网看到什么? 官方希望网友看完会做什么? 对于大家来说,官网的意义当然是快速了解产品做什么,解决什么问题,使

一分钟上手artTemplate

一分钟上手artTemplate artTemplate是腾讯开源的前端模版引擎.之前做hue二次开发,只接触过用python写的mako模版引擎,所以之前对前端模版引擎了解不是很多. 这次因为pm叫我快速做一个demo放到阿里云给客户看.页面交互也不复杂,就想用拼接字符串来动态加载后台数据,好快点交差.结果pm一句“你先做着,交互和ui改好再给你”,我“qnmd”..... 拼接字符串还是算了,就去github找到了这款星星最多的arttemplate. 废话不多说,一分钟上手一个简单的例子

基于Vue的通用框架Nuxt.js

问题:最近有些朋友问我写官网,用Vue框架实现好不好? 相信很多使用Vue的小伙伴们一样疑惑这个问题,其实从这个问题就可以知道你对Vue这个框架是否真的熟悉了.其实单单使用Vue这个框架来做官网的,其实是不友好的,非常不利于SEO,抓取.因为Vue是通过把你的代码编译的,生成是SPA,里面的html其实是空的,Nuxt.js属于SSR,也就是服务器渲染.Nuxt.js打包生成的每个路由都会对应相对的html文件.有利于网站抓取,SEO. Vue适合做对seo无关紧要的项目,别的项目不适合,但是N

前端学习 node 快速入门系列 —— 报名系统 - [express]

其他章节请看: 前端学习 node 快速入门系列报名系统 - [express] 最简单的报名系统: 只有两个页面人员信息列表页:展示已报名的人员信息列表.里面有一个报名按钮,点击按钮则会跳转到报名页报名页:用于报名.里面是一个表单,可以输入姓名和年龄,点击保存,成功后会跳转到人员信息列表页本文主要分 3 部分: 使用 node 实现这个项目介绍 express 相关知识使用 express 重写这个项目 Tip: 有将本文分成两篇的打算,因为篇幅有点长:但最后还是决定写在一起,因

03 - Vue3 UI Framework - 首页

顶部边栏做完了,接下来开始做官网的首页返回阅读列表点击这里创建视图文件夹让我们先新建一个 src/views 文件夹,用来存放官网的主要视图然后在该文件夹下新建两个 vue 文件,作为我们的视图 Home.vue,首页 Document.vue,文档页再配置一下 router.ts 来实现跳转 import { createWebHistory, createRouter } from 'vue-router' import Home from './views/Home.vue'

04 - Vue3 UI Framework - 文档页

官网的首页做完了,接下来开始做官网的文档页返回阅读列表点击这里路由设计先想想我们需要文档页通向哪些地方,这里直接给出我的设计: 所属子标题跳转路径文件名(*.vue) 指南介绍 /document/introduction Introduction 指南安装 /document/install Install 指南快速上手 /document/start Start 组件 Button /document/button Button 组件 Dialog /document/d

VSCODE 插件初探

写在前面分享一个vscode插件background(用于改变背景).点击直接跳到vscode插件开发步骤做vscode的插件,很久就有这个想法了,但是一直因为这样,那样的事情耽误,放弃了N次.不过确实让我对文档有了个直观的了解. 上周末的时候因为测试妹纸要加班测试,让我也到公司加班,等待可能出现的bug这理由听着就扯淡当然一群妹纸都到公司等着了,我也必须去......于是在等待bug的时间里看了看官方的文档,在这里写了点自己的摸索结果. 本文分为2部分,1是分享自己做的一个demo,2个

HTML5服务器端推送事件解决PHP微信墙推送问题

问题描述以前的文章中<PHP微信墙制作,开源>已经用PHP搭建了一个微信墙获取信息的服务器,然后我就在想推送技术应该怎么解决,上一篇已经用了.NET 的signalr做了一个微信墙,PHP一直没什么好思路,本来想用websocket,但自己写socket要解析websocket协议,PHP有一个比较好的实现是workerman,github地址请戳这里,但是都不是很中意,昨天给自己做官网的时候,看了一下MDN,浏览发现了这个东西"使用服务器发送事件",突然就有了思路,今天

Android 定制下拉刷新头部 Ultra Pull To Refresh

我们看到手机中的各种APP的花样繁多的下拉刷新是不是有点心动呢,想着自己定制自己的专门的下拉刷新,市场上比如,58同城,京东,天猫,美团等下拉刷新都是在下拉头部执行帧动画,我最近看到一个APP,就是慕课网的Android客户端,平时有时候看这个网站的学习视频,就下了一个,发现它的头部是一个圆形的水波纹效果: 看起来很Cool,正好公司有需求做官网的APP,正好可以用上公司的Logo做一个水波纹的下拉刷新,首先要实现水波纹的效果,通过解压慕课网的客户端,发现它的实现其实也是用帧动画,就是假的水波纹

php爬取微信文章内容

php爬取微信文章内容在做官网升级的时遇到新的需求,需要将公司公众号文章显示在官网的文章模块下.但存在的问题是:微信文章的链接会失效,并且需要对文章部分内容做修改,同时要减少微信运营人员的工作量,避免重新上传素材编辑排版等,所以决定根据链接爬取文章的富文本内容. 实现的方式是基于http://weixin.sogou.com/,在这个站点可以搜索公众号,以及公众号的文章,这样就可以使用curl模拟请求,获取文章信息,然后正则处理,获取html文本,无图文本,以及文章的标题.封面.作者等基本信息

基于MVC的网站和在线教育系统

最近老表说要创业,想要做一个网站做宣传,还想要一个在线教育系统. 学习了一部分 Java, 决定用.Net MVC做官网或直接做成静态HTML网站,主要是因为.Net MVC 技术简单,效率高,需求不确定. 考虑的点在: 1.官网:主营业务,合作客户,主要优势,企业文化,企业宣传图片,基本全没有,要不就直接用HTML直接做成静态网站,后期有什么加什么,网站修改维护起来简单,直接添加页面,改页面链接就行,用MVC做成CMS系统感觉意义不大. 2.在线教育系统:用MVC做一个宣传的,带导航的,加一

Express使用art-template模板引擎

第一步:安装 npm install --save art-template npm install --save express-art-template 第二步:指定.html使用的解析引擎(官方给出的是art) app.engine('解析文件的后缀名', require('express-art-template')) 第三步:使用模板进行传值 app.get('/', function (req, res) { res.render('index.html', { user: { na

vscode开发中绝对让你惊艳的插件！！！(个人在用)

识别模版引擎 1.Apache Velocity :识别Velocity(vm) 2.Art Template Helper:识别artTemplate 点击路径跳转 1.Laravel goto view 在浏览器中查看 1.View In Browser 外观配置配色:Solarized Dark/Darcula Theme/Atom One Dark Theme 图标:VSCode Great Icons/Material Icon Theme,给不同类型的文件配置不同的图标,非常直观:

ES6/ES2015的一些特性的简单使

1.一些常用的ES6的特性: let, const, class, extends, super, arrow functions, template string, destructuring, default, rest arguments,这些都是ES6常用的语法. let, const 这两个的用途与var类似,都是用来声明变量的,但在实际运用中他俩都有各自的特殊用途. Dome1: var name = '张三' while (true) { var name = '李四' conso

关于@font-face的使用

以前在写网页的时候,总是使用浏览器默认的字体,因此从未使用过@font-face,然而,最近在做官网的时候,UI规定了字体,要在所有浏览器下都展现同一效果.多番查询下,发现@font-face用起来是比较容易的. 首先我们在使用某一特定字体的时候,需要先下载字体的源文件,例如方正北魏楷书简体(FZBWKSJW),方正兰亭特黑长简体等等,常用的字体格式有:.eot..svg..ttf..woff这四种. 引自w3c的一段话: Internet Explorer 9, Firefox, Opera,

art-template 做官网

热门专题