代码之家 › 专栏 › 技术社区 › Wailan Tirajoh

首次加载VUE后外部JS文件不工作

inertiajs vue.js laravel javascript

Wailan Tirajoh · 技术社区 · 3 年前

我正在努力 生成单个页面 应用程序使用 Vue+惯性+laravel 。我有一个 包含外部js文件的html模板 .当将模板与vue集成时,我注意到, 页面刷新后,js只运行一次 和 未应用于其他页面(使用路由器链接导航时)

我尝试了一些方法:

A.使用mounted在vue模板中添加js脚本

mounted() {
        let appscript = document.createElement("script");
        appscript.setAttribute(
            "src",
            "/dist/js/app.js"
        );
        document.head.appendChild(appscript);
    }

B.使用meta信息添加js脚本

metaInfo: {
    script: [
      {
        src: "/dist/js/app.js",
        async: true,
        defer: true,
      },
    ],
  },

这是我的刀片锉

<!DOCTYPE html>
<html lang="en" class="light">

<head>
    <meta charset="utf-8">
    <link href="/dist/images/logo.svg" rel="shortcut icon">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <title>
        CollaborApps
    </title>
    <link rel="stylesheet" href="{{ asset('dist/css/app.css') }}" />
    <link href="{{ asset('css/app.css') }}" rel="stylesheet">
    <script type="application/javascript" src="{{ asset('/js/app.js') }}" defer></script>
    <script type="application/javascript" src="{{ asset('/dist/js/app.js') }}" defer></script> <- this is the external js
    @routes
</head>

<body class="main">
    @inertia
</body>

</html>

如何将javascript文件与vue SPA集成?

0 回复 | 直到 3 年前

推荐文章

SenorPuerco · 突然得到“目标类[Inertia\Ssr\Gateway]不存在。”我不使用Inertia的Ssr。我怎样才能回到一个正常工作的网站?

2 年前

Dev · 在laravel rest api中按特定角色获取所有用户

2 年前

Mofid · 如何在livewire中加速请求?

2 年前

JUSTIN CHUA · 导出Laravel excel图像失败

2 年前

twan · Laravel产量为空

2 年前

Pouya · Foreach循环不添加计数器

2 年前

Erni · Laravel 9 Tailwindcss在代码更改后始终必须由npm运行dev

2 年前

322quick1 · Laravel-多选择查询

2 年前

gfaster · Laravel迁移:使用本机PHP枚举

2 年前

jose · withCount where条件中的eager loading pass变量

2 年前