首页
学习
活动
专区
圈层
工具
发布
    • 综合排序
    • 最热优先
    • 最新优先
    时间不限
  • 来自专栏大前端666

    Vue实战系列—头部模块编写(5

    通过上篇我们了解到了vue可以通过axios发送前端请求。 我们知道的在发送请求可以在creted()钩子内,也可以在mounted()钩子内。 如下,我们在app.vue中进行数据请求 <script> // 1、导入头部模块 import Myheader from 'components/Header/Header' 2.处理数据 2.1 通过props进行父子组件通信 父组件App.vue下: 进行数据绑定。 CSS拼接 4.动画 5.gif https://cn.vuejs.org/v2/api/#transition 定义 进入 .xxx-enter   过渡开始的状态 .xxx-enter-to bulletin-detail-leave {    opacity: 1; } 调用 <transition name="bulletin-detail"></transition> vue

    97320发布于 2019-06-19
  • 来自专栏京程一灯

    HTML5 拖放API与Vue.js实战

    css/bootstrap.min.css" integrity="sha384-JcKb8q3iqJ61gNV9KGb8thSsNjpSL0n8PARn9HuZOnIxN0hoP+VmmDGMN5t9UJ0Z script> export default {}; </script> <style scoped> div.card { margin-bottom: 15px; box-shadow: 0 0 5px HTML5 拖放 API 是什么? 当用户将鼠标移到可拖动元素上时,拖动操作开始,然后将元素移动到启用拖放的元素上。 再默认情况下,唯一可拖动的 HTML 元素是图像和链接。 修改 App.vue 使其能够反映状态和组件组成: // App.vue <template>

    总结 在本文中,我们介绍了什么是 HTML 5 拖放 API ,如何使用,以及如何在 Vue.js 中实现。 拖放功能也可以在其他前端框架和原生 JavaScript 中使用。

    5.4K10发布于 2021-01-13
  • 来自专栏睡不着所以学编程

    Vue笔记(5)

    学习内容 ⊙ 组件可以访问Vue实例数据吗 ⊙ 父子组件的通信 ⊙ 组件通信-父传子 ⊙ 组件通信-子传父 组件可以访问Vue实例数据吗 我们可以测试一下: 得出的结果是不行的 Vue

    26010编辑于 2022-09-20
  • 来自专栏Swingz

    vue学习】5.axios+vue

    vue学习】5.axios+vue 引入js <script src="https://unpkg.com/axios/dist/axios.min.js"></script> <script src ="https://cdn.jsdelivr.net/npm/<em>vue</em>/dist/<em>vue</em>.js"></script> 代码 <! "https://unpkg.com/axios/dist/axios.min.js"></script> <script src="https://cdn.jsdelivr.net/npm/<em>vue</em> /dist/<em>vue</em>.js"></script> <script> /* 接口1:随机笑话 请求地址:https://autumnfish.cn/ api/joke 请求方法:get 响应内容:随机笑话 */ var app = new Vue({ el:"#app

    79520发布于 2020-12-18
  • 来自专栏郭少华

    Vue实战开发

    Vue-cli搭建开发环境 1.安装vue-cli脚手架 mpm install vue-cli -g 2.初始化项目 vue init webpack AwesomePos 3.修改index.html 在src/components/目录下新建Fwsb.vue文件。 Fwsb

    </template> <script> export default { name:'Fwsb' } </script> <style> </style> 5. import Vue from 'vue' import Router from 'vue-router' import HelloWorld from '@/components/HelloWorld <link rel="stylesheet" href="http:////at.alicdn.com/t/font_681056_c2x<em>5</em>ok2j659ltyb9.css"> 图标顺利引入到项目中,已经可以使用它们了

    90920发布于 2018-09-11
  • 来自专栏Hammer随笔

    Vue 组件实战

    目录 Vue 组件 axios实现数据请求 计算属性 案例一:首字母大写 案例二:过滤案例 监听属性 局部组件 全局组件 组件通信之父传子 组件通信之子传父 ref属性(组件间通信) 普通标签使用 组件使用 ref属性 事件总线(不常用) 动态组件和keep-alive Vue 组件 axios实现数据请求 <! /js/vue.js"></script> <script src="https://unpkg.com/axios/dist/axios.min.js"></script> </head> /js/vue.js"></script> </head> <body>

    <! () //new一个vue的实例,就是中央事件总线 Vue.component('child1', { template: `
    <input type

    1.2K30编辑于 2022-05-09
  • 来自专栏网罗开发

    今天,学会这5Vue高级实战技巧就够了!

    前言 今天,我们来分享几个不可不知的vue高级实战技巧。 技巧 自动注册组件 我们平时可能这样引入注册组件。每次都得需要在头部引入,然后注册,最后在模板上使用。 import Vue from "vue"; import VueRouter from "vue-router"; // 引入组件 import home from ".. import Vue from 'vue' import App from '. /App.vue'; Vue.component(Button.name, Button); Vue.component(Select.name, Select); /* 或写为 * Vue.use import Vue from 'vue' import App from './App.vue'; import uIcompontents from ".

    75810发布于 2021-07-21
  • 来自专栏全栈程序员必看

    vue md5.js_VUE.js

    版权声明:本文内容由互联网用户自发贡献,该文观点仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 举报,一经查实,本站将立刻删除。

    11.9K40编辑于 2022-09-28
  • 来自专栏web前端教室

    vue+vant+node+mongoDB+koa2》电商项目实战连载(5

    然后我在网上找了三张图片,把它们的路径链接写在vue文件中的data里, ? 现在我们已经有数据了,那么怎么使用它呢?接着看代码的文档、演示, ? 把上面的代码直接复制到vue的template中, ? 这时如果你没有写错的话,页面上就应该会出现轮播图效果了。 <!

    69120发布于 2018-12-07
  • 来自专栏柠檬先生

    VUE 入门基础(5)

    如果你声明了这个组件       Vue.component('my-component', {           template: '

    Hi

    '       

    71390发布于 2018-01-22
  • 来自专栏前端迷

    Vue SSR入门实战

    如果对 Vue SSR 完全不了解,请先阅读官方文档。 思路 Vue 提供了一个官方 Demo,该 Demo 优点是功能大而全,缺点是对新手不友好,容易让人看蒙。 /App.vue'; var app = new Vue({ el: '#app', components: { App } }); // App.vue <template 编写服务端渲染主体逻辑 Vue SSR 依赖于包 vue-server-render,它的调用支持两种入口格式:createRenderer 和 createBundleRenderer,前者以 Vue // App.vue <template>

    App.vue

    vue with vue


    参考资料 从零开始搭建vue-ssr系列之一:写在前面的话, By 会说话的鱼 vue SSR 服务端渲染记录, By echo_numb Vue SSR 官方文档实践·一:从零到粗暴混合前后端, By

    3.5K50发布于 2019-08-09
  • 来自专栏前端说吧

    Vue - 实战疑点总结

    1.注册全局组件(是一个单vue页面组成的一个组件,而不是现拼的template结构) 结构: 代码:main.js import UserList from '. /components/UserList' Vue.component('user-list', UserList)  2. 背景图引入路径错误问题: 如图,结构如下,怎么核对检查,路径和文件名都是没错的, 但是不清楚为什么就是找不到图片还报错 后来才想到,我的sass文件是引入在app.vue中的,所以路径不对 改完后果然ok

    66470发布于 2018-05-17
  • 来自专栏前端进阶-詹躲躲

    vue项目实战实战技巧总结

    4.methods必须需要一定的条件去触发,而computed则不需要. 5.computed依赖缓存,如果不需要经常变动的用computed,需要经常变动的用methods。 this.pageName = 'async' }, 2000) } } </script> <meta name="参数" content="具体的描述"> 5. 5.index : 搜索引擎索引此网页。 6.follow : 搜索引擎继续通过此网页的链接索引搜索其它的网页。 <meta http-equiv="参数" content="具体的描述"> 其中 http-equiv 属性主要有以下几种参数: A. content-Type(设定网页字符集)(推荐使用 HTML5 http-equiv="content-Type" content="text/html;charset=utf-8"> //旧的HTML,不推荐 <meta charset="utf-8"> //HTML5设定网页字符集的方式

    3.9K40编辑于 2022-04-28
  • 来自专栏Python绿色通道

    Scrapy实战5:Xpath实战训练

    win32stdio.py", line , in <module> import win32api ModuleNotFoundError: No module named 'win32api' (5) (5)在jobbole.py中的的parse函数中加一个断点,然后Debug模式运行测试文件main.py 断点设置: ? 断点设置debug结果分析: ? (5)我们继续获取其他数据(复习巩固一下Xpath的用法) 为了快速、有效率的调式数据,给大家推荐一种方法: # cmd 虚拟环境中输入: scrapy shell 你要调试的网址 scrapy shell

    1K20发布于 2020-02-12
  • 来自专栏晓月寒·

    vue实战-vue父子组件通信方式汇总

    vue项目的一大亮点就是组件化。使用组件可以极大地提高项目中代码的复用率,减少代码量。但是使用组件最大的难点就是父子组件之间的通信。 /children.vue' export default { data () { return { msg: 'hello, children' } }, methods /children.vue' export default { data () { return { msg: "hello,my son" } }, methods

    58120发布于 2019-05-22
  • 来自专栏网络收集

    5、如何使用Vue呢?

    5、如何使用Vue呢?Vue的本质,就是一个JavaScript的库:刚开始我们不需要把它想象的非常复杂;我们就把它理解成一个已经帮助我们封装好的库;在项目中可以引入并且使用它即可。 那么安装和使用Vue这个JavaScript库有哪些方式呢? 方式一:在页面中通过CDN的方式来引入;方式二:下载Vue的JavaScript文件,并且自己手动引入;方式三:通过npm包管理工具安装使用它(webpack再讲);方式四:直接通过Vue CLI创建项目 的CDN引入:<script src="https://unpkg.com/<em>vue</em>@next"></script>1Hello Vue案例的实现:

    Hello World >Hello World

    ' } const app = Vue.createApp(why); app.mount("#app")</script>

    33310编辑于 2022-06-30
  • 来自专栏全栈程序员必看

    Vue5)计算属性computed

    基础例子

    总价格:{{totalPrice}}

    <script> const vm = new Vue({ el: "#app 你可能已经注意到我们可以通过在表达式中调用方法来达到同样的效果:

    总价格:{{getAllPrice()}}

    <script> const vm = new Vue

    1K20编辑于 2022-09-19
  • 来自专栏Micro_awake web

    Vue学习5:条件渲染

    DOCTYPE html> 2 <html lang="en"> 3 <head> 4 <meta charset="UTF-8"> 5 <title>vue6</title> --<link rel="stylesheet" type="text/css" href="main.css"/>--> 8 <script src="<em>vue</em>.js"></script> --vue会尽可能高速的渲染元素,通常是复用已有元素--> 20 <! --v-show不支持template元素,也不支持v-else--> 49

    50 51 52 <script> 53 new Vue({ 54 el: '#app

    85130发布于 2018-05-28
  • 来自专栏Micro_awake web

    Vue学习5:条件渲染

    DOCTYPE html> 2 <html lang="en"> 3 <head> 4 <meta charset="UTF-8"> 5 <title>vue6</title> --<link rel="stylesheet" type="text/css" href="main.css"/>--> 8 <script src="<em>vue</em>.js"></script> --vue会尽可能高速的渲染元素,通常是复用已有元素--> 20 <! --v-show不支持template元素,也不支持v-else--> 49

    50 51 52 <script> 53 new Vue({ 54 el: '#app

    63600发布于 2018-07-31
  • 来自专栏狮乐园

    高级 Vue 组件模式 (5)

    $element 服务 Angular: 可以使用 ViewChild、ContentChild 或者 template ref 来获取引用 react: 使用 ref 属性声明获取引用的逻辑 在 vue 你可以通过下面的链接来看看这个组件的实现代码以及演示: sandbox: 在线演示 github: part-5 总结 文章中所举例子的交互,在实际场景中很常见,比如: 当通过一个 icon 触发搜索框时

    72210发布于 2020-01-21
  • 领券