- ArthurSlog
- SLog-12
- Year·1
- Guangzhou·China
- July 17th 2018
未来如果已经被预知 那么现实会毫无意义 珍惜年少的时光 最宝贵的时光
开发环境MacOS(High Sierra 10.13.5)
需要的信息和信息源:
- 本文的所有
- vue.js 的,当前(2018/7/17)一共有 13 个,分别是:
- v-text
- v-html
- v-show
- v-if
- v-else
- v-else-if
- v-for
- v-on
- v-bind
- v-model
- v-pre
- v-cload
- v-once
- vue.js 的模版指令,与编程语言的 “关键字” 或者 “保留字” 有点相似,例如 if(判断语句关键字)、for(循环语句关键字)
开始编码
- 首先,搭起静态服务器,先切换至桌面路径
cd ~/Desktop
- 创建一个文件夹node_vue_directive_learningload
mkdir node_vue_directive_learningload
- 切换路径到新建的文件夹下
cd node_vue_directive_learningload
- 使用npm初始化node环境,一路enter键完成初始化
npm init
- 使用npm安装koa和koa-static
sudo npm install koa koa-static
- 参考,我们在当前路径下编写index.js和index.html两份文件
index.js
const serve = require('koa-static');const Koa = require('koa');const app = new Koa();// $ GET /package.jsonapp.use(serve('.'));app.listen(3000);console.log('listening on port 3000');
index.html
ArthurSlog The static web server by ArthurSlog
- 接下来,我们来根据使用场景,来编写 vue.js 模版指令代码
v-html.html
ArthurSlog Hello {
{ rawHtml }}Hello
- 之前的 静态web服务器 已经启动了,所以这里就不用再启动一次了
- 现在你可以打开浏览器,在地址栏输入 127.0.0.1:3000/v-html.html,你会看到:使用了v-html 的,会把rawHtml的值进行 html 格式解析
- 至此,我们把 vue模版指令 v-html 介绍了一遍,更多使用方法和信息,请参考 。
欢迎关注我的微信公众号 ArthurSlog