jquery - 将 Parsley 与 rails 6 一起使用
问题描述
我将欧芹用于多步形式。我的 Rails 版本是 6.0.3。我已按照以下步骤安装欧芹。
yarn add parsleyjs
我的 yarn.lock 文件:
parsleyjs@^2.9.2:
version "2.9.2"
resolved "https://registry.yarnpkg.com/parsleyjs/-/parsleyjs-2.9.2.tgz#67c96961d371821f2623965fa2cc81a4522874cb"
integrity sha512-DKS2XXTjEUZ1BJWUzgXAr+550kFBZrom2WYweubqdV7WzdNC1hjOajZDfeBPoAZMkXumJPlB3v37IKatbiW8zQ==
dependencies:
jquery ">=1.8.0"
我的 package.json 文件:
{
"name": "patient_web",
"private": true,
"dependencies": {
"@fortawesome/fontawesome-free": "^5.13.1",
"@rails/activestorage": "^6.0.0",
"@rails/ujs": "^6.0.0",
"@rails/webpacker": "4.2.2",
"jquery": "^3.5.1",
"parsleyjs": "^2.9.2",
"turbolinks": "^5.2.0"
},
"version": "0.1.0",
"devDependencies": {
"webpack-dev-server": "^3.11.0"
}
}
这是我的 webpack/environment.js 文件: const { environment } = require('@rails/webpacker')
常量 webpack = 要求('webpack')
environment.plugins.prepend('Provide',
new webpack.ProvidePlugin({
$: 'jquery/src/jquery',
jQuery: 'jquery/src/jquery',
Parsley: 'parsleyjs/src/parsley'
})
)
module.exports = environment
这是我在 app/javascript/packs/application.js 中还需要的:
require("@rails/ujs").start()
require("turbolinks").start()
require("@rails/activestorage").start()
require("scss/application.scss")
require("jquery")
require("parsleyjs")
我在通过以下方式检查表单验证时遇到以下错误:
$(form).parsley().validate()
错误:
Uncaught TypeError: $(...).parsley is not a function
at HTMLButtonElement.<anonymous> (sign_up:75)
at HTMLButtonElement.dispatch (event.js:328)
at HTMLButtonElement.elemData.handle (event.js:148)
如果有人可以帮助我,那就太好了。
解决方案
这可能是弃用,gem 自 2018 年以来没有更新。rails 6 于 2019 年推出,因此兼容性可能是问题所在。
或者您可以尝试在 javascript 文件夹中创建一个文件夹,并在其中创建两个文件,一个是导入 scss,另一个是导入 js,然后将这些文件导入到 application.js 文件中。
如果 css 未加载,请将其添加到您的应用程序 html 文件中
<%= stylesheet_link_tag 'application', media: 'all', 'data-turbolinks-track': 'reload' %>
<%= stylesheet_pack_tag 'application', media: 'all', 'data-turbolinks-track': 'reload' %>
是的,链接标签和包装标签。
推荐阅读
- python - except 子句中的断点无权访问绑定异常
- java - 将 swagger 核心库添加到我的 dropwizard 应用程序会完全破坏它
- php - 页面加载时清空购物车允许在 WooCommerce 中添加到购物车
- java - Spring AOP:为什么@After注解在Java、AspectJ中的@AfterThrowing之后执行?
- c++ - 我是如何在这段代码中得到分段错误的?
- azure - 微软认知服务文本到语音问题
- subscription - 使用 Stripe 订阅跳过付款的最佳方式(免费一个月)?
- excel - 有没有一种方法可以在 excel 的列的所有行中搜索特定的子字符串
- html - html 链接因隐藏表格而褪色
- java - Tomcat 应用程序到 Spring Boot 应用程序