image

WEB前端 - Vue - 路由

程序员日记      2019-09-17
本章节我们将为大家介绍Vue.js路由。Vue.js路由允许我们通过不同的URL访问不同的内容。通过Vue.js可以实现多视图的单页Web应用（singlepagewebapplication，SPA）。注：本博客Vue系列文章是基于webpack生成的框架做的示例示例1.简单的路由使用新建两个路由组件/src/components/HelloWorld.vue<template> <div>  这里是HelloWorld &nbs...
标签:
452 人看过
image

WEB前端 - Vue - 组件详解

程序员日记      2019-09-17
组件（Component）是Vue.js最强大的功能之一。组件可以扩展HTML元素，封装可重用的代码。组件系统让我们可以用独立可复用的小组件来构建大型应用，几乎任意类型的应用的界面都可以抽象为一个组件树注：本博客Vue系列的文章，全部是使用webpack生成的vue框架模板，其App.vue文件本身就是作为一个组件的存在,在App.vue组件中引用的子组件一般都是局部组件，本文对这个局部组件的使用进行讲解，如果需要了解全局组件如何使用的话，请使用万能的百度。示例.简单的组件使用示例子组件/src...
标签:
452 人看过
image

WEB前端 - Vue - 表单

程序员日记      2019-09-16
我们现在来介绍一下Vue中表单的简单应用。首先我们知道可以用v-model指令在表单控件元素上创建双向数据绑定。示例.各种表单的简单使用<template> <divid="app">  <div>   <p>单行文本：</p>   <br/>   <inputtype="text"v-model="...
标签:
462 人看过
image

WEB前端 - Vue - 样式绑定

程序员日记      2019-09-16
class与style是HTML元素的属性，用于设置元素的样式，我们可以用v-bind来设置样式属性。Vue.jsv-bind在处理class和style时，专门增强了它。表达式的结果类型除了字符串之外，还可以是对象或数组。示例1.当isActive=true时,将绑定样式active。<template> <divid="app">  <divv-bind:class="{active:isActive}">测试绑定</d...
标签:
455 人看过
image

WEB前端 - Vue - 监听属性

程序员日记      2019-09-16
我们可以通过watch函数实现对属性的监听示例1.监听计数器变化<template> <divid="app">   <pstyle="font-size:25px;">计数器:{{counter}}</p>   <button@click="counter++"style="font-size:25px;">点我加1</button> <...
标签:
463 人看过
image

WEB前端 - Vue - 函数与计算属性

程序员日记      2019-09-11
函数：methods计算属性:computed。示例<template> <divid="app">  <p>原始字符串:{{message}}</p>  <p>方法示例，反转字符串:{{reversedMessage2()}}</p>  <p>计算属性示例，反转字符串:{{reversedMessage}}</p> &n...
标签:
469 人看过
image

WEB前端 - Vue - 条件语句与循环语句

程序员日记      2019-09-11
条件语句v-if,v-else-if,v-else指令和v-show指令使用示例<template> <divid="app">  <pv-if="demo1">你看的到我</p>  <pv-if="demo2">你看不到我</p>  <pv-else>你看的到我2</p>  <pv-if="demo3"&...
标签:
433 人看过
image

WEB前端 - Vue - 基础语法

程序员日记      2019-09-11
文本数据绑定最常见的形式就是使用{{...}}（双大括号）的文本插值<template> <divid="app">  {{message}} </div></template><script>exportdefault{ name:'App', data:function(){  return{  message:"你好，欢迎来到程序员...
标签:
439 人看过
image

WEB前端 - Vue - webpack目录结构与第一个项目示例

程序员日记      2019-09-11
我们使用npm安装了基于webpack框架的vue，我们得了解一下webpack框架创建项目的目录结构目录结构build:项目构建(webpack)相关代码config:配置目录，包括端口号等。我们初学可以使用默认的。node_modules:npm加载的项目依赖模块src:这里是我们要开发的目录，基本上要做的事情都在这个目录里。里面包含了几个目录及文件： --assets:放置一些图片，如logo等。 --components:目录里面放了一个组件文件，可以不用。&nbsp...
标签:
450 人看过
image

WEB前端 - Vue - 安装

程序员日记      2019-09-11
安装方式1.下载到本地并安装下载链接https://vuejs.org/js/vue.min.js安装方式2.引用CDN官方<scriptsrc="https://cdn.jsdelivr.net/npm/vue/dist/vue.js"></script>几个国内的CDN<scriptsrc="https://cdn.staticfile.org/vue/2.2.2/vue.min.js"></script><scriptsrc="http...
标签:
417 人看过
image

Zeo 薛

PHP全栈型程序员一枚，技术讨论，项目合作请扫描头像并注明来意！！！
搜索内容
最近更新
Swoole - 入门 - 使用异步客户端（MySQL,Redis,Http）
[2019-09-20]
Swoole - 入门 - 网络通信协议设计
[2019-09-20]
Swoole - 入门 - 创建异步TCP客户端
[2019-09-20]
Swoole - 入门 - 创建同步TCP客户端
[2019-09-19]
Swoole - 入门 - 创建websocket服务器
[2019-09-19]
Swoole - 入门 - 创建HTTP服务器
[2019-09-19]
Swoole - 入门 - 创建UDP服务器
[2019-09-18]
Swoole - 入门 - 创建TCP服务器
[2019-09-18]
Swoole - 入门 - 安装
[2019-09-18]
WEB前端 - Vue - 生命周期钩子函数
[2019-09-17]
友情链接
青岛跃锐信息技术 谷无隅的博客 手机批发价 密信在线客服系统 互动多媒体制作 网络公关
Copyright 程序员日记© 2019-2030   粤ICP备18124750号
粤公网安备 44030702005167号