(Gorails)vuejs系列视频: Webpacker／vue-resource（不再为官方推荐）。
频：https://gorails.com/episodes/using-vuejs-for-nested-forms-part-1?autoplay=1
在嵌套表格上使用vue.js。
在application.html.erb
上<head>内加上：<%= javascript_pack_tag 'hello_vue' %>
如果有style（css）的话加上：<%= stylesheet_pack_tag 'hello_vue' %>
在hello_vue.js 进行配置：
需要安装vue-turbolinks和vue-resource：
在terminal上输入：
- yarn add 'vue-turbolinks'
- yarn add ''vue-resource''
添加：
import TurbolinksAdapter from 'vue-turbolinks'
import VueResource from 'vue-resource'
Vue.use(VueResource)
Vue.use(TurbolinksAdapter)
HTMLElement.dataset
The dataset property on the HTMLElement interface provides read/write access to all the custom data attributes(data-*) set on the element
返回一个DOMStringMap, 可以读写元素的custom data attributes （data-*）
- string = element.dataset.camelCasedName;
- element.dataset.camelCasedName = string;
- string = element.dataset[camelCasedName];
- element.dataset[camelCasedName] = string;
案例：
视频1 嵌套表格
clone后，进入/teams
需要运行：bin/webpack-dev-server命令，提示没有找到
更新bundle update webpacker，再启动rails s
报告：config/webpacker.yml No such file 提示运行rails webpacker:install
rails webpacker:install安装后
我运行：
- bin/webpack
- bin/webpack-dev-server, 这个窗口必须始终打开。
然后程序就可以正确执行了，
(Gorails)vuejs系列视频: Webpacker／vue-resource（不再为官方推荐）。的更多相关文章
- 海美迪Q系列视频文明书
海美迪Q系列视频文明书
- [iOS]C语言知识点系列视频
C语言知识点系列视频 目录 C语言技术视频-01-变量的定义 C语言技术视频-02-程序分支结构(if...else) C语言技术视频-03-程序分支结构(switch) C语言技术视频-04-程序循 ...
- 【vuejs深入三】vue源码解析之二 htmlParse解析器的实现
写在前面 一个好的架构需要经过血与火的历练,一个好的工程师需要经过无数项目的摧残. 昨天博主分析了一下在vue中,最为基础核心的api,parse函数,它的作用是将vue的模板字符串转换成ast,从而 ...
- VUE系列一：VUE入门：搭建脚手架CLI（新建自己的一个VUE项目）
一.VUE脚手架介绍 官方说明:Vue 提供了一个官方的 CLI,为单页面应用快速搭建 (SPA) 繁杂的脚手架.它为现代前端工作流提供了 batteries-included 的构建设置.只需要几分 ...
- 后盾网lavarel视频项目---Vue项目使用vue-awesome-swiper轮播插件
后盾网lavarel视频项目---Vue项目使用vue-awesome-swiper轮播插件 一.总结 一句话总结: vue中的插件的使用和js插件的使用一样的简单,只是vue插件的引入过程有些不同 ...
- 后盾网lavarel视频项目---vue实现动态添加和删除板块
后盾网lavarel视频项目---vue实现动态添加和删除板块 一.总结 一句话总结: 原理就是:列表时根据vue中的videos变量中的元素来遍历的,初始时videos:[{title:'',pat ...
- vue resource 携带cookie请求 vue cookie 跨域
vue resource 携带cookie请求 vue cookie 跨域 1.依赖VueResource 确保已安装vue-resource到项目中,找到当前项目,命令行输入: npm instal ...
- vue 快速入门 系列 —— 初步认识 vue
其他章节请看: vue 快速入门 系列 初步认识 vue vue 是什么 Vue (读音 /vjuː/,类似于 view) 是一套用于构建用户界面的渐进式框架. 所谓渐进式,就是你可以一步一步.有阶段 ...
- Vue.js系列(一)：Vue项目创建详解
引言 Vue.js作为目前最热门最具前景的前端框架之一,其提供了一种帮助我们快速构建并开发前端项目的新的思维模式.本文旨在帮助大家认识Vue.js,并详细介绍使用vue-cli脚手架工具快速的构建Vu ...
随机推荐
- 【VS Hacks】定制VS
# Hack 24 定制快捷键 VS能够做很多键盘的配置,其实在VS中目前已经发现有很多的快捷键了,但是在这个技巧篇里会学到如何创建新的快捷键,以及编辑已有的快捷键.VS中包含很多的命令,只有其中 ...
- python print 使用分隔符 或行尾符
使用print() 函数输出数据,但是想改变默认的分隔符或者行尾符. >>> print('ACME', 50, 91.5) ACME 50 91.5 >>> pr ...
- Python: attrgetter()函数: 排序不支持原生比较的对象
问题: 想排序类型相同的对象,但是他们不支持原生的比较操作. answer: 内置的sorted()函数有一个关键字参数key,可传入一个callable对象给它 这个callabel对象对每个传入的 ...
- Zookeeper使用实例——分布式共享锁
前一讲中我们知道,Zookeeper通过维护一个分布式目录数据结构,实现分布式协调服务.本文主要介绍利用Zookeeper有序目录的创建和删除,实现分布式共享锁. 举个例子,性能管理系统中,告警规则只 ...
- 为什么采用4~20mA的电流来传输模拟量？（转）
源: 为什么采用4~20mA的电流来传输模拟量?
- 使用node连接MongoDB数据 综本地及linux服务器记
gitee地址 启动mongo D:\MongoDB> ./bin/mongod --dbpath ./data/db MongoDB 提供了简单的 HTTP 用户界面. 如果你想启用该功能,需 ...
- Python3基础 str endswith 是否以指定字符串结束
Python : 3.7.0 OS : Ubuntu 18.04.1 LTS IDE : PyCharm 2018.2.4 Conda ...
- 高通RFC适配RFFE-添加MIPI设备【转】
本文转载自:https://blog.csdn.net/u011212816/article/details/80828625 RF driver主要设计到的器件 1.Transceiver 2.RF ...
- jQuery:ajax处理html页面
源码: $.ajax({ url: url, success: function (data) { var reg = /<body>[\s\S]*<\/body>/g; ]; ...
- ZooKeeper与Kafka相关
Kafka集群搭建: https://www.cnblogs.com/likehua/p/3999538.html https://www.cnblogs.com/mikeguan/p/7079013 ...