一、今晚遇到一个问题,就是不能直接在 html 直接调用 js 代码的问题

二、会出现如下错误:

    Refused to execute inline script because it violates the following Content Security Policy directive: "script-src 'self' 'unsafe-eval'". Either the 'unsafe-inline' keyword, a hash ('sha256-    vKuX0yKlIAX3ZzZ9/PIUq7x1z425uZLu4glsP+4fqXM='), or a nonce ('nonce-...') is required to enable inline execution.

三、解决方法,就是将 js 代码写成单独的文件,然后包含进去即可。

    # index.html
<!DOCTYPE html>
<html>
<head>
<script src="js/vue.min.js"> </script>
</head> <body>
<div id="chen_test_id1">
<p>{{ message }}</p>
</div>
<script src="js/test.js"> </script>
</body> </html>
    // js/test.js
src="js/vue.min.js">
new Vue({
el: '#chen_test_id1',
data: {
message: 'Hello Vue.js!'
}
})

Chrome 调用vue.js 记录的更多相关文章

  1. iOS 或者Android调用vue.js 里面的方法

    1.原生调用vue.js 某个vue组件下的方法. 比如**.vue里面有个这样的方法: 如果这样的话,在iOS或者Android里面是调用不了这个ajax方法的. 需要在**.vue (我的版本是v ...

  2. chrome调试vue.js的插件:vue.js devtools

    1.什么是vue.js devtools? vue.js devtools是chrome的一款插件,用来调试vue的一款神器. 2.为什么下载vue.js devtools? 由于vue是数据驱动的, ...

  3. Chrome安装Vue.js devtool F12无效

    要安装 vue-devtools-4.1.4_0 链接: https://pan.baidu.com/s/1aeUxKJEUDW0U_i6uuAZFvQ 提取码: 4btc vue-devtools- ...

  4. vue-axios当只调用vue.js又需要axios请求多时

    可以将axios方法封装一个函数 (function () { ASK = { get:function (url,data,succFun,errFun) { axios.get(url,{ par ...

  5. oc 与 js交互之vue.js

    - .vue.js 调用oc的方法并传值 vue.js 组件中调用方法: methods: {     gotoDetail(item){         //此方法需要在移动端实现,这里可以加入判断 ...

  6. Vue.js模板语法

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  7. 每天记录一点:NetCore获得配置文件 appsettings.json vue-router页面传值及接收值 详解webpack + vue + node 打造单页面(入门篇) 30分钟手把手教你学webpack实战 vue.js+webpack模块管理及组件开发

    每天记录一点:NetCore获得配置文件 appsettings.json   用NetCore做项目如果用EF  ORM在网上有很多的配置连接字符串,读取以及使用方法 由于很多朋友用的其他ORM如S ...

  8. Vue.js中,如何自己维护路由跳转记录?

    在Vue的项目中,如果我们想要做返回.回退操作时,一般会调用router.go(n)这个api,但是实际操作中,使用这个api有风险,就是会让用户跳出当前应用,因为它记录的是浏览器的访问记录,而不是你 ...

  9. vue.js学习记录

    vue.js学习记录 文章已同步我的github笔记https://github.com/ymblog/blog,欢迎大家加star~~ vue实例 生命周期 beforeCreate:不能访问thi ...

随机推荐

  1. 【转】Scheme 编程环境的设置

    Scheme 编程环境的设置 介绍了这么久的 Scheme,却没有讲过如何配置一个高效的 Scheme 的编程环境.有些人开始学习 Scheme 的时候感觉无从下手,所以今天讲一下它的配置. Sche ...

  2. HDU2594 Simpsons’ Hidden Talents 【KMP】

    Simpsons' Hidden Talents Time Limit: 2000/1000 MS (Java/Others)    Memory Limit: 32768/32768 K (Java ...

  3. Github emoji 表情包大全

    传送门:https://www.jianshu.com/p/72a4214764e4 https://www.webpagefx.com/tools/emoji-cheat-sheet/

  4. Appium 点击屏幕

    由于版本变更,appium 点击屏幕方法已经改变, TouchAction action = new TouchAction(driver); Duration duration = Duration ...

  5. 为什么推荐你用 Kotlin语言?

    谷歌大牛说:为什么 Kotlin 比你们用的那些垃圾语言都好 原标题:谷歌大牛说:为什么 Kotlin 比你们用的那些垃圾语言都好 编译:伯乐在线/黄小非 [伯乐在线/程序员的那些事 导读]:5月18 ...

  6. docker-compose教程(安装,使用, 快速入门)

    1.Compose介绍Docker Compose是一个用来定义和运行复杂应用的Docker工具.一个使用Docker容器的应用,通常由多个容器组成.使用Docker Compose不再需要使用she ...

  7. java.util.concurrent.ExecutionException: com.android.ide.common.process.ProcessException 的解决办法之一

    在查看别人的代码的时候,遇到了把工程导入到 Android Studio ,报:ExecutionException: com.android.ide.common.process.ProcessEx ...

  8. C语言中文件打开模式(r/w/a/r+/w+/a+/rb/wb/ab/rb+/wb+/ab+)浅析

    C语言文件打开模式浅析 在C语言的文件操作语法中,打开文件文件有以下12种模式,如下图: 打开模式  只可以读   只可以写  读写兼备 文本模式 r w a r+ w+ a+ 二进制模式 rb wb ...

  9. (原创)一个简洁通用的调用DLL函数的帮助类

    本次介绍一种调用dll函数的通用简洁的方法,消除了原来调用方式的重复与繁琐,使得我们调用dll函数的方式更加方便简洁.用过dll的人会发现c++中调用dll中的函数有点繁琐,调用过程是这样的:在加载d ...

  10. cocoside 编译错误可能问题

    版本不对..查看/usr/xxx/.profile中console等的全局变量 安装了不和谐的版本..记得删除application/cosos 重新安装. 或者干掉cocostudio