![](https://img-blog.csdnimg.cn/20201014180756918.png?x-oss-process=image/resize,m_fixed,h_64,w_64)
vue
hongChengliu
此人很懒,什么都没有写
展开
-
vue slot插槽组件
slot插槽见名知意 就是把想要写的东西做一个容器出来然后写进去组件写在components文件夹下面,我的插槽组件名为 slottest.vue.<templater><div><div><h1>插槽组件</h1></div><slot></slot><!-- slot标签就可...原创 2019-10-24 17:20:06 · 195 阅读 · 0 评论 -
vuex 状态管理模式 最简单的demo
vuex可以这样理解:他就是一个可供所有页面调用的全局数据。第一步 下载vuex插件在cmd中输入 npm install vuex --save 下载第二步:在src文件路劲下创建一个叫 store的文件夹 在store文件夹下创建index.js文件。第三步:在store文件夹下的inndex.js文件写import Vue from 'vue'import Vuex f...原创 2019-10-24 05:35:47 · 89 阅读 · 0 评论 -
VUE router页面跳转传值
在vue中有三种方法,首先创建router.vue文件。在router文件中实现页面跳转第一种方式 也是最简单的 单纯跳转页面 <router-link to="/demo1"> 点击我跳转到demo1页面 </router-link>第二种方式 对跳转的页面传值router.vue 传值页面<router-link :to="{name:d...原创 2019-10-23 22:22:44 · 365 阅读 · 0 评论 -
vue自定义组件
1. 组件写在那个文件夹下?写在componetes文件目录下2.自定义文件怎么写? 写好后怎么引用?答:自定义的组件文件写起来和正常的vue项目极其相似,写好后怎么用呢?答: 1. 在index页面的自定义组件页面 component.vue //自定义组件页面 <template> <div> <div> <but...原创 2019-10-22 22:13:03 · 150 阅读 · 0 评论 -
VUE 表单绑定
文本表单绑定这里是文本框输入的值: {{texts}} 多选绑定javac++html 这里是你选中的选项 {{checkbox}} 下拉框绑定ABC下拉框的所选中的值 {{ options }} data(){ return { texts:'', checkboxs:[], options:''}}...原创 2019-10-22 13:45:57 · 66 阅读 · 0 评论 -
Vue 事件处理 列表渲染
事件处理第一种方式 点击我弹出警告框 methods:{show(){alert(“点击button弹出警告框”)}}第二种方式<button @click=“show”> 点击我弹出警告框 methods:{show(){alert(“点击button弹出警告框”)}}第三种方式 点击我弹出警告框 methods:{show(h){alert(...原创 2019-10-21 16:11:04 · 164 阅读 · 0 评论 -
vue条件渲染
v-if<template><div><div v-if="ok"> 是否展示本div取决于 ok的布尔值 在data里体现</div></div></templayte><script>export default{data(){return { ok:true}}}</sc...原创 2019-10-20 22:42:42 · 69 阅读 · 0 评论 -
VUE的class与style
class<template><div v-bind:class="{ active:isactive, change:ischange }"> class="active change" </div></template><script>export default{date(){return {isactive:...原创 2019-10-20 22:41:09 · 80 阅读 · 0 评论 -
VUE模板语法 v-on v-bind v-html 过滤器filters
<templayte><div> <!-- v-on 是一个点击事件--><div v-on:click="show">点击我</div> <!-- v-bind class属性red是一个变量 red的值在data中--><div v-bind:class="red"></div&...原创 2019-10-17 18:10:41 · 410 阅读 · 0 评论 -
vue数据选项data、computed、methods使用方式
datadata是里面的数据是全局属性,可以在export default{ } 任何地方调用。deta是方法所以写成data(){ return{ } }。数据都写在return{} 里面 数据呈键值对形式:data(){return(){message:'数据',num:12}}...原创 2019-10-17 00:05:05 · 1199 阅读 · 0 评论 -
环境安装完成后vue项目的运行
vue运行已有项目运行已有项目创建属于自己的vue页面运行自己的vue页面如何改变文本的样式插入链接与图片如何插入一段漂亮的代码片生成一个适合你的列表创建一个表格设定内容居中、居左、居右SmartyPants创建一个自定义列表如何创建一个注脚注释也是必不可少的KaTeX数学公式新的甘特图功能,丰富你的文章UML 图表FLowchart流程图导出与导入导出导入运行已有项目cmd找到已经创建好的项...原创 2019-10-15 20:54:16 · 226 阅读 · 0 评论