我正在使用 PHP 框架 Laravel 构建应用程序。我正在使用 Bootstrap 4 preset并安装了一个新项目。一切正常,CSS,甚至是您从导航栏获得的下拉菜单。但出于某种原因,当我尝试通过执行 this 来初始化工具提示时,我的控制台中出现了 Typerror .还尝试通过工具提示类初始化工具提示,但这似乎也不起作用。我在 popover 组件上遇到了同样的问题。
Uncaught TypeError: $(...).tooltip is not a function
Uncaught TypeError: $(...).popover is not a function
除了删除您从 Laravel 安装中获得的注释外,我没有对 JS 进行任何更改。
bootstrap.js
window._ = require('lodash');
//Popper for Jquery/Bootstrap
window.Popper = require('popper.js/dist/umd/popper');
//Jquery for Bootstrap
try {
window.$ = window.jQuery = require('jquery/dist/jquery.slim');
require('bootstrap');
} catch (e) {}
//Axios for AJAX Calls
window.axios = require('axios');
window.axios.defaults.headers.common['X-Requested-With'] = 'XMLHttpRequest';
let token = document.head.querySelector('meta[name="csrf-token"]');
if (token) {
window.axios.defaults.headers.common['X-CSRF-TOKEN'] = token.content;
} else {
console.error('CSRF token not found: https://laravel.com/docs/csrf#csrf-x-csrf-token');
}
应用程序.js
//Bootstrap application with dependencies
require('./bootstrap');
//Import Vue
window.Vue = require('vue');
//Vue components
Vue.component('example-component', require('./components/ExampleComponent.vue'));
//Vue init
const app = new Vue({
el: '#app'
});
//Tooltip init
$(function () {
$('[data-toggle="tooltip"]').tooltip()
})
HTML/ Blade
<i class="ion-help-circled" data-toggle="tooltip" data-placement="top" title="Dit is het adres waarop de website staat tijdens de testfase"></i>
还尝试在我的 blade 文件中的常规脚本下方包含工具提示 init,但同样,似乎不起作用。
<!-- Scripts -->
<script src="{{ asset('js/app.js') }}"></script>
<script>
$(function () {
$('[data-toggle="tooltip"]').tooltip()
});
</script>
我猜这似乎是 popper.js 的问题,因为它同时适用于工具提示和弹出组件。
最佳答案
试试看
window.$ = window.jQuery = require('jquery'); // <-- main, not 'slim'
window.Popper = require('popper.js');
require('bootstrap');
“slim”jQuery dist 排除了一些功能,这些功能是正确注册 tooltip
作为 jQuery 插件所必需的。
关于javascript - Uncaught TypeError : $(. ..).tooltip 不是 Laravel 应用程序中的函数(Bootstrap 4 预设),我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/48459440/